1

我正在设计一个网页：http ://trackstudent.pt/index.php

我遇到了一个我无法修复的错误，如果您在检查链接后注意到，<p></p>它被推到了右边，我不知道为什么。所有的 div 都有 margin:0, padding:0 并且有足够的空间使该元素适合该空间。

令人惊讶的是，在第二行内容中，这件事并没有发生。

我有来自 1kbgrid 的 css（960px 网格，12 列）：

// Grid Cell (column)
.column {
    margin: 5px 10px;
    overflow: hidden;
    float: left;
    display: inline;
}

// Grid row
.row {
    width:960px;
    margin: 0px auto;
    overflow: hidden;
}

// Nested rows
.row .row {
    margin: 0px -10px;
    width: auto;
    display: inline-block;
}

在 HTML 中，我有：

<body> -> width: 100%
<div id="container"> -> width: 100%
<div id="mainWrapper"> -> width: 960px
<section class="row"> -> width: 960px

编辑：明确：两者；在#wrapperMain 中它有效！但我仍然不明白为什么会这样，因为标题也有 height:40px 和徽标，所以徽标扩展中不应该有任何区域通过标题。任何人都可以提供见解？

先感谢您。

4

1 回答 1

3

它来自浮动标志。只需添加以下 CSS：

#wrapperHeader {
 overflow:hidden; /* Forces header to contain elements */
}

或者：

#wrapperMain {
 clear:both; /* Pushes wrapper down until it's past bottom of header elements */
}
于 2012-07-23T20:32:03.747 回答