我试图水平中心一个<div>块元素在页面上，并将其设置为最小宽度。最简单的方法是什么?我想要<div>元素内联与我的页面的其余部分。我来举个例子:
page text page text page text page text
page text page text page text page text
-------
| div |
-------
page text page text page text page text
page text page text page text page text
当前回答
九年过去了，我想是时候推出一个新版本了。以下是我最喜欢的两个(现在是一个)。
保证金
将margin设置为auto。你要知道方向序列是边距:*上* *右* *下* *左*;或边距:*上下*左右*
aside{ display: block; width: 50px; height: 100px; background-color: green; float: left; } article{ height: 100px; margin: 0 0 0 50px; /* 50px aside width */ background-color: grey; } div{ margin: 0 auto; display:block; width: 60px; height: 60px; background-color: blue; color: white; } <!DOCTYPE html> <html> <head> </head> <body> <aside> </aside> <article> <div>The div</div> </article> </body> </html>
中心:废弃的，不要用这个!
使用<center></center>标签环绕<div></div>。
例子:
aside{ display:block; background-color:green; width: 50px; height: 100px; float: left; } center{ display:block; background-color:grey; height: 100px; margin-left: 50px; /* Width of the aside */ } div{ display:block; width: 60px; height: 60px; background-color:blue; color: white; } <!DOCTYPE html> <html> <head> </head> <body> <aside> </aside> <article> <center> <div>The div</div> </center> </article> </body> </html>
其他回答
CSS, HTML: Div.mydiv{宽度:200px;Margin: 0 auto} < div class = " mydiv”> 我在中间 < / div >
您的图表还显示了块级元素(通常是div)，而不是内联元素。
在我的头顶，在FF2+/Safari3+/IE7+中支持min-width。可以在IE6上使用巧妙的CSS，或者简单的JS。
你可以在CSS上使用margin: 0 auto而不是margin-left: auto;margin-right:汽车;
如果你的<div>有position: absolute你需要使用width: 100%;
#parent {
width: 100%;
text-align: center;
}
#child {
display: inline-block;
}
在你的html文件中，你写:
<div class="banner">
Center content
</div>
你写的CSS文件:
.banner {
display: block;
margin: auto;
width: 100px;
height: 50px;
}
对我有用。
.center {
margin-left: auto;
margin-right: auto;
}
最小宽度不是全局支持的，但是可以使用
.divclass {
min-width: 200px;
}
然后可以将div设置为
<div class="center divclass">stuff in here</div>
