开发者

float left every other item echo php

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.


$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.


If you don't care about IE too much, you can use

.clientes_provincia:nth-of-type(odd) { float: left }


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.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜