css - 正在定位位置为 :relative sloppy coding? 的大量内容 block

Question

我发现自己放置了很多 div、图像和内容，通常使用 position:relative 来坚持我正在遵循的设计。

例如，如果我想将表单放置在靠近顶部的位置，我会输入:

.form_class{
    position:relative;
    bottom:150px;
}

由于该元素在不断变化中保持其位置，因此我必须使用 position:relative 将所有其他元素向上放置 150px 以保持间隙闭合。

我觉得这是草率的编程，真正的网络集成商如何定位他们的元素？

提前致谢。

Answer 1

使用相对定位存在潜在问题。

如果您使用相对定位来规避间隙问题，那么问题仍然存在于后台。例如，如果差距来自边距，则边距仍然存在。如果您不知道边距从何而来，您就不知道它在所有浏览器中是否都相同，您也不知道标记中任何看似无关的更改是否会改变边距。

此外，正如您提到的，您只是将间隙从元素的顶部移动到元素的底部，因此您必须不断调整后面的所有元素。每次调整都可能增加另一层不安全性，布局可能会在其他浏览器中中断。

大多数浏览器都有一个开发者工具，您可以在其中检查一个元素，以准确了解该元素应用了哪些 CSS，以及边距和填充是多少。您可以使用它来找出差距的来源，这样您就可以从源头上消除它们，而不是规避它们。