Bootstrap排液项目崩溃

我不明白为什么从第二行开始的图像开始倒塌，并没有出现在第一行？Bootstrap排液项目崩溃

enter image description here

<div class="container-fluid"> 
    <div class="row-fluid"> 
     <div class="span9 offset3"> 
     <?php 
     $step = 1; 
     do{ 
     echo <<<EOF 
     <div class="span4 {$class}" id="p{$rst_catalog['p_id']}"> 
     <a href="pillow.php?p_id={$rst_catalog['p_id']}"><img src="images/{$rst_catalog['p_img']}" alt="img" title="{$rst_catalog['p_name']}" /></a> 
     <div class="row"> 
     <div class="span12"> 
     <a href="pillow.php?p_id={$rst_catalog['p_id']}">{$rst_catalog['p_name']}</a> 
     {$rst_catalog['p_rubric']} 
     {$rst_catalog['p_price1']}.00 руб. 
     </div> 
     </div> 
     </div> 
     EOF; 
     if ($step == 4) 
      $step = 11; 
     else 
      $step++; 
     } while ($rst_catalog = mysql_fetch_assoc($res_catalog)); 
     ?> 
     <?php require_once ("inc/inc_show_pagination.php"); ?> 
     </div> 
    </div> 
</div>

代码（它是通过PHP产生），其余的都可以找到here

来源

2013-08-26 Konstantin Rusanov

enter image description here 您使用保证金左：只有first-child 0这就是问题

添加margin-left: 0所有id与p1,p4,p7,p10..它正在工作

风格：

.left-most{margin-left:0} 

<?php 
for($i=0;$i<10;$i++){ 
    $tst=$i/3; 
    if(!is_float($tst)){ 
     $class='left-most'; 
    }else{ 
     $class=''; 
    } 
?> 
<div class="span4 <?php echo $class; ?>">Your stuff here</div> 

<?php } ?>

来源

2013-08-26 10:00:43 overflow

我删除了p1，p4，p7，p10的所有内容，但仍然不起作用。 –

@КонстантинРусанов看到我编辑的答案更详细。 – overflow

如何将它添加到最左边的（p1，p4，p7 ...）跨度，如果它们是在一系列php中生成的？ –

我已经面对完全相同的行为。

我建议你创建不同的行，而不是封装在同一行内的div。一行内的Div应该只占用一行（很明显），这就是为什么所有元素都有一个空白左边。在换行时保留这个空白，这就是为什么你的div不对齐的原因。

也许你可以插入每行3格。

即

<div class="container-fluid"> 
    <div class="span10 row-fluid"> 
    <div class="span3"></div> 
    <div class="span3"></div> 
    <div class="span3"></div> 
    </div> 
    <div class="span10 row-fluid"> 
    <div class="span3"></div> 
    <div class="span3"></div> 
    <div class="span3"></div> 
    </div> 
    ... 
    </div>

另一种选择是把div的容器内。这也是可行的，因为div浮动。

<div class="container-fluid"> 

    <div class="span3"></div> 
    <div class="span3"></div> 
    <div class="span3"></div> 
    <div class="span3"></div> 
    <div class="span3"></div> 
    <div class="span3"></div> 
    ... 
    </div>

来源

2013-08-26 10:25:40 manuvendev

Bootstrap排液项目崩溃

回答

相关问题