如何在第二个宽度为100%的地方并排放置两个div？
如何在第二个宽度为100%的地方并排放置两个div？
提问于 2010-12-02 03:39:59
我想要实现这一点：
width=60px width = remaining space
|------| |-----------------------------------|
| div1 | | Loren ipsun... |
|------| | |
| div2 |
|-----------------------------------|是否可以并排放置两个div，让第二个div留出所有剩余空间？
回答 5
Stack Overflow用户
回答已采纳
发布于 2010-12-02 03:43:37
只需浮动第一个div，并设置第二个div的左边距以适应第一个div的宽度。如下所示：
div.one {
width: 60px;
float: left;
}
div.two {
margin-left: 60px;
}请记住，div上的width CSS属性仅适用于内容，因此需要将margin-left设置为第一个div的width、border、margin和padding属性的总和。
Here是您的jsfiddle的更新版本。如果你对此有任何疑问，请告诉我。
Stack Overflow用户
发布于 2010-12-02 03:51:03
下面是它的实现方法：
.image {
background:green;
color:green;
height:60px;
position:absolute;
width:60px;
}
.content {
background:blue;
color:white;
margin-left:60px;
}Stack Overflow用户
发布于 2010-12-02 04:01:31
这就是它：
CSS：
#container { background: silver; width: 100% }
.image
{
background: green; color: green;
width: 60px; height: 60px;
float: left;
}
.content
{
background: blue; color: white;
margin-left: 60px;
}在jsFiddle上(目前正在上演)
希望这能有所帮助！
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/4328336
复制相关文章
相似问题