问题与CSS，HTML和背景颜色。

我有两组复选框，每个都有一个标题。该标题应该具有灰色背景，然后复选框区域在背景中应该没有颜色。

问题是，如果我只将一组复选框与其标题放在一起，背景效果很好。

但是，当我把第二组复选框，第一组的复选框区域有灰色背景，似乎是继承第二组的标题BG。

这是代码。任何线索？

谢谢！

<div class="bgFilterTitles"> 
    <h1 class="filterTitles">COLOR</h1> 
</div> 
<div class="boxes"> 
<?php 
    $colors = $con -> prepare("SELECT DISTINCT color_base1 FROM item_descr ORDER BY color_base1 ASC"); 
    $colors ->execute(); 
    while ($colorBoxes = $colors->fetch(PDO::FETCH_ASSOC)) 
    { 
    echo "<input type='checkbox' class='regularCheckbox' name='color' value='".$colorBoxes[color_base1]."' /><font class='similarItemsText'> ".$colorBoxes[color_base1]."</font><br />"; 
    } 
?> 
</div> 


<div class="bgFilterTitles"> 
    <h1 class="filterTitles">PRICE</h1> 
</div> 
<div class="boxes"> 
<?php 
    $prices = $con -> prepare("SELECT DISTINCT price FROM item_descr ORDER BY price ASC"); 
    $prices ->execute(); 
    while ($priceSort = $prices->fetch(PDO::FETCH_ASSOC)) 
    { 
     echo "<input type='checkbox' class='regularCheckbox' name='price' value='".$priceSort[price]."' /><font class='similarItemsText'> ".$priceSort[price]."</font><br />"; 
    } 
?> 
</div>

下面是使用CSSS：

.boxes { 
    width: 160px; 
    float: left; 
    padding: 10px; 
    border: 1px solid #C6C6C6; 
    clear: both; 
} 
.filterTitles 
{ 
    background-color: #F1F1F1; 
    font-family: Arial,Helvetica,Verdana,Sans-serif; 
    font-size: 11px; 
    font-weight: normal; 
    color: #333; 
    text-transform: uppercase; 
    padding: 4px; 
    border: 1px; 
    border-color: #C6C6C6; 
    border-top-style: dotted; 
}

来源

2012-12-16 samyb8

任何机会，你可以重新使用jsfiddle.net这个问题？ –

我不知道如果我理解正确的问题，请问这是什么你想干什么？

http://jsfiddle.net/mdLVG/

在这种情况下，你需要添加clear:both;您.filterTitles CSS类。

来源

2012-12-16 16:49:46

问题与CSS，HTML和背景颜色。

回答

相关问题