float left every other item echo php - php

Question

im trying to float left every other UL tag, and i know i should flaot left every item and every other item clear:left, from what i've read, but the thing is i dont know how many UL or LI would appear because im echoing from a data base.
this is the CSS:
.clientes_provincia li{
font-family:Verdana, Geneva, Tahoma, sans-serif;
font-size:10px;
font-weight:bold;
text-decoration:none;
list-style-type:none;
text-align:left;
margin-top:0px;
margin-left:10px;
}
.clientes_comuna li{
font-family:Verdana, Geneva, Tahoma, sans-serif;
font-weight:bold;
font-size:10px;
font-weight:bold;
text-decoration:none;
list-style-type:none;
list-style-position:inside;
}
.clientes_giro li{
font-family:Verdana, Geneva, Tahoma, sans-serif;
font-size:10px;
font-weight:normal;
text-decoration:none;
list-style-type:disc;
}
.clientes_nombre li{
font-family:Verdana, Geneva, Tahoma, sans-serif;
font-size:10px;
font-weight:normal;
text-decoration:none;
list-style-type:circle;
margin-left:20px;
}
and this is the php code, where i echo the list:
<?php
$nombreProvincia = "";
$nombreComuna = "";
$nombreGiro = "";
$nombreNombre = array();
while ($row = mysql_fetch_assoc($resultAraucania)) {
if ($nombreProvincia == $row['nombreProvincia']) {
if ($nombreComuna == $row['nombreComuna']) {
if ($nombreGiro == $row['nombreGiro']) {
$nombreNombre[] = $row['nombreNombre'];
}
else { //nombreGiro
echo '<li>' . implode('</li><li> ', $nombreNombre).'</li></ul></li></ul>';
$nombreGiro = $row['nombreGiro'];
echo '<ul class="clientes_giro"><li>'.$nombreGiro.'<ul class="clientes_nombre">';
$nombreNombre = array($row['nombreNombre']);
}
}
else { // nombreComuna
echo '<li>' . implode('</li><li> ', $nombreNombre).'</li></ul></li></ul></li></ul>';
$nombreComuna = $row['nombreComuna'];
echo '<ul class="clientes_comuna"><li>'.$nombreComuna;
$nombreGiro = $row['nombreGiro'];
echo '<ul class="clientes_giro"><li>'.$nombreGiro.'<ul class="clientes_nombre">';
$nombreNombre = array($row['nombreNombre']);
}
}
else { // nombreProvincia
if (!empty($nombreNombre)) {
echo '<li>' . implode('</li><li> ', $nombreNombre).'</li></ul></li></ul></li></ul></li></ul>';
}
$nombreProvincia = $row['nombreProvincia'];
// this is the UL i'd like float for every other one.
echo '<ul class="clientes_provincia"><li>'.$nombreProvincia;
$nombreComuna = $row['nombreComuna'];
echo '<ul class="clientes_comuna"><li>'.$nombreComuna;
$nombreGiro = $row['nombreGiro'];
echo '<ul class="clientes_giro"><li>'.$nombreGiro.'<ul class="clientes_nombre">';
$nombreNombre = array($row['nombreNombre']);
}
}
echo '<li>' . implode('</li><li> ', $nombreNombre).'</li></ul></li></ul></li></ul></li></ul>';
?>
So what I'd like to do is float every other UL tag of the 'Provincia' echo.
Thanks for the help!
at this moment with what i have i get a list like this:
Provincia1
Comuna1
Giro1
Nombre1
Nombre2
Provincia2
Comuna2
Giro2
Nombre3
Nombre4
I want the provincia 2 be on the right side of provincia 1, and if I have another list
provincia 3 i want it to be under pronvincia 1, and a prinvia 4 beside provincia 3 and so on.., thats what i mean with floating every other UL provincia, hope that helps as an example.

Answer 1

$i = 0;
while ($row = mysql_fetch_assoc($resultAraucania)) {
$class = $i++ % 2 ? 'odd' : 'even';
...
echo '<li class="' . $class . '">';
...
}
This allows you to easily distinguish between even and odd columns and float "every other" column left.

Answer 2

If you don't care about IE too much, you can use
.clientes_provincia:nth-of-type(odd) { float: left }

Answer 3

I think that your markup and looping is making this problem harder than it should be. I actually think it could just be 1 loop.
The trick here is to use a width on a container <div> and each <ul> which automatically forces the browser to float two <ul>s and then drop to the next row for the following <ul>. If you can't use this static width idea then you have 2 very good other solutions already.
Here is a small example which I have tested at http://writecodeonline.com/php/
$dataRow = array();
$dataRow[0] = array('nombreProvincia' => 'A123', 'nombreComuna' => 'A456', 'nombreGiro' => 'A789', 'nombreNombre' => array(101, 102));
$dataRow[1] = array('nombreProvincia' => 'B123', 'nombreComuna' => 'B456', 'nombreGiro' => 'B789', 'nombreNombre' => array(201, 202));
$dataRow[2] = array('nombreProvincia' => 'C123', 'nombreComuna' => 'C456', 'nombreGiro' => 'C789', 'nombreNombre' => array(301, 302));
echo '<div style="width:600px">';
foreach ($dataRow as $key => $row) {
$nombreProvincia = $row['nombreProvincia'];
$nombreComuna = $row['nombreComuna'];
$nombreGiro = $row['nombreGiro'];
$nombreNombre = '<li>'.implode('</li><li>', $row['nombreNombre']).'</li>';
echo $provincia = <<<HTML
<ul class="clientes_provincia" style="width:200px;float:left;">
<li>$nombreProvincia
<ul class="clientes_giro">
<li>$nombreGiro
<ul class="clientes_nombre">
$nombreNombre
</ul>
</li>
</ul>
</li>
</ul>
HTML;
}
echo '<br style="clear:both"></div>';
Also, heredoc is awesome if you use PHP >= 4.