我有一个div元素(1200px宽度),包含3个内部divs.
第一个和最后一个具有静态大小(150px和200px).我希望第二个在徽标和按钮之间居中.问题是我不知道如何集中这个div......
.container {
width: 1200px;
height: 100px;
position: absolute;
margin: 0 auto;
background-color: grey;
}
.logo {
width: 150px;
height: 50px;
float: left;
background-color: darkred;
}
.text {
width: auto;
float: left;
}
.buttons {
width: 200px;
height: 70px;
float: right;
background-color: darkgreen;
}
SOME CENTERED TEXT HERE
一种方法是display将.text元素设置为inline-block(并删除float: left),然后添加text-align: center到父元素以使其居中.由于其他元素是浮动的,text-align不会影响它们,并且它只会使内联.text元素居中.
.container {
width: 1200px;
height: 100px;
position: absolute;
margin: 0 auto;
background-color: grey;
text-align: center;
}
.logo {
width: 150px;
height: 50px;
float: left;
background-color: darkred;
}
.text {
display: inline-block;
}
.buttons {
width: 200px;
height: 70px;
float: right;
background-color: darkgreen;
}
SOME CENTERED TEXT HERE
京公网安备 11010802040832号 | 京ICP备19059560号-6 