使用css的自适应布局

Question

我试图创建一个适应性的CSS布局，我需要学习很多东西然后欢迎所有的帮助。有一个关于适应性here的例子。在我的小提琴手中没有任何作用，有here。

Answer 1

我不确定你的问题是什么。但是如果你问为什么你的列没有正确排列，那是因为数学。

您将它们设置为宽度为45％，边距为3％（加边框）。 45 +（2 * 3）= 51％。你不能有两列，每列51％适合100％的空间。

Answer 2

Here's有关如何实现自适应布局以帮助您入门的教程。它还提供了示例代码。

Answer 3

这是您的fiddle, slightly updated。

正如DA已经指出的那样，HHalfBarLft和HHalfBarRgt的内容太大了，所以它们并不适合彼此相邻。

此外，您不必在position: absolute div上使用ct：只需在其中添加清除元素（如HFullBar），可以根据需要调整高度

当你删除所有定位的元素时，页脚也会保持原状。