CSS – vertical order of elements [duplicate] - php

Question

This question already has answers here:
HTML & CSS: Vertical Flow Layout (columnar style), how to implement?
(3 answers)
Closed 9 years ago.
As always, I have a "simple" question at first sight.
I have a div on my webpage containing a set of buttons (links, actually, but they serve as buttons). Simply put:
<div class="container">
text
text
text
text
</div>
Now what I need to do is to line them up in vertical order. What I mean is: normally if they appear as inline-block or inline element, they will line up horizontally one after another and when the line ends, the following link appears on the next one. The same goes for float: left.
But I need them to be in horizontal order – in other words, instead of rows, there will be columns with set height. When the column reaches the end, the following button should appear in the next column.
Is there a way to make that possible through CSS?
The only other way I can imagine is that I set a function in php or something like that but I'm not really good or knowledgeable about it. But I do have the option of putting it there so if you have this kind of solution, I'll be grateful too.
Thanks a lot.

Answer 1

Haven't yet tired, but hopes it helps.
$link_array = array();
$link_array[] = array('Google', 'http://google.com/');
$link_array[] = array('Yahoo', 'http://yahoo.com/');
$link_array[] = array('Bing', 'http://bing.com/');
$link_per_column = 10;
foreach ($link_array as $position => $this_link)
{
if ($position % $link_per_column === 0 && ($position === 0))
{
echo '<div class="column">';
echo "<a href='{$this_link[1]}'>{$this_link[0]}</a>";
}
elseif ($position % $link_per_column === 0 && ($position !== count($link_array)))
{
echo '</div><div class="column">';
echo "<a href='{$this_link[1]}'>{$this_link[0]}</a>";
}
elseif (($position === count($link_array)))
{
echo "<a href='{$this_link[1]}'>{$this_link[0]}</a>";
echo '</div>';
}
else
{
echo "<a href='{$this_link[1]}'>{$this_link[0]}</a>";
}
}