css - 如何在具有 2 列布局的 div 上方添加另一个 div?

标签 css html

这是我的 fiddle : http://jsfiddle.net/LLFpp/

我刚刚开始学习 CSS 和 Div(从旧表移过来),我正在尝试弄清楚如何将另一个绿色 div 放置在已经存在的绿色 div 之上,并且两者之间有 20px 的空间2 个 div,同时将右侧的 div 保留在原位。

我试着像处理表格那样来做,但是它搞砸了整个布局,压低了右边的 div。

所以基本上现在我有:

| |

我需要:

| |
|

有道理吗? :D

最佳答案

您需要为两个“绿色”div 准备一个容器,并让那个容器左对齐。

像这样:

<div id="bigcontainer">
    <green div 1>
    <green div 2>
</div>
<div id="menu">
 <!--whatever-->
</div>

在你的 CSS 中

#bigcontainer{float:left;}

然后您可以使用“绿色 div”做任何您想做的事,而不会影响主要设计。

希望它足够清楚:)

关于css - 如何在具有 2 列布局的 div 上方添加另一个 div?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/11199251/

相关文章:

html - 使用 CSS 媒体查询

css - Firefox 过滤器动画

html - fixed div on mobile 不固定

javascript - 在 JS 中向突出显示的文本添加标签不起作用

jquery - 将图像链接到 <img class> 中的 URL

html - 动态设置无序列表的div高度

css - 扩展 CSS 样式表?

html - 修复列表项的宽度并 overflow hidden 的文本

javascript - 如何将 bool 值从 cshtml 文件传递​​到 javascript 函数/构造函数?

html - 为什么要使用协议(protocol)相关的 URL?