第 1 列(左)用于内容。 Column2(右侧/边栏)用于相关信息。说布局是 66%/34%。如果没有侧边栏内容,我需要一种方法使 Column1 自动拉伸(stretch)到 100%。有任何想法吗。我知道这是可以做到的。我只是不记得如何。
+---------+---------+
| Content | sidebar |
+---------+---------+
+-------------------+
|Content/ no-sidebar|
+-------------------+
最佳答案
你可以尝试这样的事情。以下是两种不同的 HTML 案例:
有侧边栏:
<div id="container">
<div id="sidebar">some content</div>
<div id="main_content">main content</div>
</div>
没有侧边栏:
<div id="container">
<div id="main_content">main content</div>
</div>
这是有条件地改变 main_content
div 大小的 CSS:
#container {
overflow: hidden;
}
#sidebar {
width: 34%;
float: right;
}
#main_content {
width: 100%;
float: left;
}
#main_content:nth-child(2) {
width: 66%;
}
关于CSS 布局(2 列布局,但如果没有侧边栏,主列必须 100% 宽),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12302935/