Question

我在chrome / safari中有一个奇怪的垂直间距错误，我在firefox中设置时错过了。似乎一些垂直间距规则被一个或另一个忽略。我已经完成了代码，但我不知所措 - 指出我正确的方向将受到高度赞赏 - 非常感谢提前。

该网站旨在教孩子健康饮食的重要性，网址为：http://ourgrowingplace.us/

Answer 1

如果你想像你想要的那样将div放在一起，请使用float：

#left {
  float: left;
  width: 100px;
}
#right {
  float: right;
  width: 50px;
}
.clear {
  clear: both;
}

我还添加了一个.clear类：确保你清除了浮点数，所以后面的任何内容都位于这两个浮点数下面：

<div id="left">left content</div>
<div id="right">right content</div>
<div class="clear"></div>

此外，您不能在相对位置元素上使用left/right/top/bottom。在绝对定位元素上使用它们，而不是将position:absolute元素放在 position:relative元素中。在这种情况下，你不应该使用它。

尽量避免使用margin将元素“推”到某个位置。现在你要添加一个负的上边距来让它上升。但是，如果你这样做，通常意味着你应该尝试另一种布局设置。

Answer 2

我建议您首先确保您的页面符合您在DTD中使用的规范，您指定的地址上的页面无效XHTML 1.0 Transitional，也不符合指定的字符集（iso-88559-1）。这实际上意味着渲染结果可能无法预测，并且因浏览器而异。

Answer 3

我不知道你在说什么垂直间距规则，但设置元素间距的正确方法是通过边距。

margin:top right bottom left;