我正在尝试使用HTML5和CSS实现以下HTML结构。 section
元素必须彼此相邻。右section
元素必须具有30像素的margin-left
和220像素的固定width
。
到目前为止我所拥有的内容如下:
HTML
<section id="section-left">My left section</section>
<section id="section-right">My right section</section>
CSS
#section-left {
float: left;
}
#section-right {
float: right;
width: 220px;
margin-left: 30px
}
我的问题是左侧section
未填充右侧section
元素的剩余空间。我的结果如下:
这里有什么问题?
答案 0 :(得分:4)
颠倒部分的顺序并使用此CSS:
#section-left {
overflow:hidden;
}
#section-right {
width:220px;
margin-left:30px;
float:right;
}
<强> jsFiddle example 强>