如何在1内对齐3个div？
如何在1内对齐3个div？
提问于 2013-07-23 06:52:00
我希望我的div的边框看起来像这样
outer div #info
------------------------------------------------------------
| |-----------------||-----------------||-----------------||
| | || || ||
| | || || ||
| | || || ||
| | 1 inner || 2 inner || 3 inner ||
| | div || div || div ||
| | || || ||
| | #leftpannel || #centerpannel || #rightpannel ||
| | || || ||
| | || || ||
| |-----------------||-----------------||-----------------||
|----------------------------------------------------------|但是当我把它放到浏览器中时，它看起来像是
------------------------------------------------------------
| |-----------------||-----------------||
| | || ||
| | || ||
| | || ||
| | 2 inner || 3 inner ||
| | div || div ||
| | || ||
| | || ||
| | || ||
| | || ||
| |-----------------||-----------------||
||------------------|--------------------------------------|
| |
| |
| |
| |
| 1 inner |
| div |
| |
| |
| |
| |
|------------------|这是我的css
#rightpannel
{
width:32%;
float:right;
height:390px;
border: solid;
border-width:1px;
border-color:green;
}
#centerpannel
{
width:32%;
display:inline;
margin-left:auto;
margin-right:auto;
height:390px;
border: solid;
border-width:1px;
border-color:green;
}
#leftpannel
{
width:32%;
float:left;
height:390px;
border: solid;
border-width:1px;
border-color:green;
}
#info
{
width:92%;
height:400px;
border: solid;
border-width:1px;
border-color:red;
margin:0 auto;
padding-left: 5px;
padding-right: 5px;
padding-top: 5px;
padding-bottom: 0px;
}这是我的html
<div id="info">
<div id="rightpannel"></div>
<div id="centerpannel"></div>
<div id="leftpannel"></div>
</div>我真的不知道为什么会发生这样的事情，我非常感谢任何人的帮助
Stack Overflow用户
发布于 2013-07-23 07:21:01
尝尝这个
#rightpannel {
width:32%;
float:right;
height:390px;
border: solid;
border-width:1px;
border-color:green;
margin-left:1%;
}
#centerpannel {
width:32%;
float:right;
height:390px;
border: solid;
border-width:1px;
border-color:green;
margin-left:1%;
}
#leftpannel {
width:32%;
float:right;
height:390px;
border: solid;
border-width:1px;
border-color:green;
}
#info {
width:100%;
height:400px;
border: solid;
border-width:1px;
border-color:red;
margin:0 auto;
padding: 5px 5px 5px 0;
}Example
您仍然需要更改页边距-填充一点。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/17798777
复制相关文章
相似问题
腾讯云开发者
