html - div不对齐

Question

我在使用下面的 CSS 时遇到问题，我似乎无法让白框与品牌框对齐：

实时网址

HTML：

    <div class="homeWrapper">
            <div class="homeWrapperContentLeft">
        <div id="default">
            <div class="content_inner">
            <h1><span class="color_red">Welcome</span>/h1>
            <p>
            </p>
        </div>
        <div class="brands">
            <h1><span class="color_red">Products</span> by Brand</h1>
            <table class="manufacturer_table" height="24" style="width: 100%;" width="242">
<tbody>
<tr>
<td>
</tbody>
</table>

<div class="homeWrapperContentLeftCenter">
    text
</div>
        </div>
        </div>
        </div>  
        </div>

CSS：

.homeWrapperContentLeft{
    width:628x;
    height:825px;
    background-color: red;
}
.homeWrapperContentLeft .brands{
    float:left;
    width:251px;
    height:598px;
    padding: 12px; 
    clear: both;
}

.homeWrapperContentLeftCenter{
    float:left;
    width: 377px;
    height: 598px;
    background:#000;
}

Answer 1

您在custom.css第36行有一个无效的 CSS ：

.homeWrapperContentLeft{
    width:628x; /* should be px not x */
    height:825px;
    background-color: red;
}

在第3266px行，您已经给出了包装器的宽度。请将其更改为auto或100%。

.homeWrapper{
    padding: 12px;
    width:66px;
}

---

接下来的事情是，你有这个.homeWrapperContentLeft .brands类有一个float: left并且你把它保持在一个非常低的宽度。删除width和float: left;。

.homeWrapperContentLeft .brands{
    float:left;
    width:251px;
    height:598px;
    padding: 12px; 
    clear: both;
}

---

最后，.homeWrapperContentLeftCenter取出.brand. 这解决了你的问题。