1

div 在我的JsFiddle上完美排列，但它们在我的网站上不起作用。

我相信问题出在我的联系表格上，因为当我将联系表格移到两个 div 下方时，它们会正确排列。

有什么建议吗？

4

2 回答 2

3

您没有清除<div class="form">元素中的浮动。

您的问题的两个很好的解决方案是添加overflow: hidden到.form或添加clear: both到#text.

于 2012-06-07T02:10:36.143 回答
0

它适用于 jsFiddle，因为它们的重置 CSS ：

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {
   margin: 0;
   padding: 0;
}

在您的情况下，这是因为 h2 的高度大于该行的其余部分。这导致您的蓝色 div 从 h2 的末尾开始。

这应该够了吧 ：

.form h2 {
  font-size: 26px;
  font-weight: 200;
  text-shadow: 1px 1px 1px #CFCFCF;
  color: #999;
  float: left;
  padding-left: 20px;
  margin: 20px 0;
}

PS：@Wex 的答案更干净；）

于 2012-06-07T02:15:10.707 回答