gpt4 book ai didi

css - 将 DIV 水平和垂直居中到 100% 高度和宽度的父 DIV

转载 作者:行者123 更新时间:2023-11-28 03:36:03 24 4
gpt4 key购买 nike

我已经堆叠了高度和宽度为浏览器窗口 100% 的父 DIV,并且似乎无法让次级 DIV 在各自的 div 内居中。

这是我堆叠的 parent :

#parent1 {
min-height:100%;
height: auto;
height: 100%;
}

#parent2 {
min-height:100%;
height: auto;
height: 100%;
}

我想将其设置为让我的内容 float 在这些堆叠的 DIV 中:

<div id="parent1">    <-- fits entire browser window --/
<div id="content1"></div> <-- centred horz. and vert. in parent1 --/
</div>
<div id="parent2"> <-- fits entire browser window but under parent1 --/
<div id="content2"></div> <-- centred horz. and vert. in parent2 --/
</div>

...等等。就目前而言,我的内容 CSS 看起来像这样,但它不起作用:

#content1 {
width:1000px;
height:500px;
left:50%;
right:50%;
margin:-250px 0 0 -500px;
}

我在绝对定位或相对定位方面都没有运气......

最佳答案

您需要添加如下位置属性:

#parent1 {
min-height:100%;
height: auto;
height: 100%;
position: relative;
}

#parent2 {
min-height:100%;
height: auto;
height: 100%;
position: relative;
}

#content1 {
width:1000px;
height:500px;
left:50%;
right:50%;
margin:-250px 0 0 -500px;
position: absolute;
}

关于css - 将 DIV 水平和垂直居中到 100% 高度和宽度的父 DIV,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14228200/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com