我如何用CSS垂直集中一个 <div> 在另一个 <div> 中?
<div id="outer">
<div id="inner">Foo foo</div>
</div>
我如何用CSS垂直集中一个 <div> 在另一个 <div> 中?
<div id="outer">
<div id="inner">Foo foo</div>
</div>
当前回答
如果有人想要一个 jQuery 解决方案的中心调整这些 divs:
$(window).bind("load", function() {
var wwidth = $("#outer").width();
var width = $('#inner').width();
$('#inner').attr("style", "padding-left: " + wwidth / 2 + "px; margin-left: -" + width / 2 + "px;");
});
其他回答
只是这样做:
<div id="outer">
<div id="inner">Foo foo</div>
</div>
CSS
#outer{
display: grid;
place-items: center;
}
<div id="outer" style="width:100%;margin: 0 auto; text-align: center;"> <div id="inner">Foo foo</div> </div>
此分類上一篇: Margin:0px auto:
此分類上一篇: <div id="outer" style="width:100%"> <div id="inner">Foo foo</div> </div>
我很抱歉,但这个90年代的婴儿只是为我工作:
<div id="outer">
<center>Foo foo</center>
</div>
我要为这个罪而去地狱吗?
#inner {
width: 50%;
margin: 0 auto;
}