gpt4 book ai didi

html - 并排放置 2 个 div,每个宽度为 50%

转载 作者:太空宇宙 更新时间:2023-11-04 13:07:25 29 4
gpt4 key购买 nike

我在一个容器中有 3 个 div。我希望第一个 div 占据 100% 的宽度,另一个 div 占据 50% 并并排位于第一个 div 下方。但是,如果我给其他 2 个 div 50% 的宽度和 float:left,则第 3 个 div 将低于第 2 个。我也尝试过 overflow 和 position,但无法正常工作。

CSS:

 .contentC{
/*width:100%;*/
overflow:hidden;
}
#box1 {
background:#f00;
float:left;
width:100%;

}

#box2 {
background:#0f0;
float:left;
width:50%;
}
#box3 {
background:#055;
float:left;
width:50%;

}

HTML:

<body>
<div class ="contentC">
<div id="box1">Hi,Div1</div>
<div id="box2">Hi,Div2</div>
<div id="box3">Hi,Div3</div>
</div>
</body>

我也尝试过使用 clearfixoverflow 但无法正常工作。

最佳答案

通过 padding: 0 移除 box2 和 box3 的所有边距和填充; margin :0;

关于html - 并排放置 2 个 div,每个宽度为 50%,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25003824/

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