我有一个内容div,里面有一些文本,内容div内有2个div并排放置。
我希望2个子div彼此相邻显示,但在文本下方而不是旁边显示。
body {
text-align: center;
}
#first, #second {
border: solid green 2px;
}
#content {
border: solid purple 2px;
display: flex;
clear: both;
}
#second {
background-color: yellow;
padding-bottom: 500px;
width: 100px;
display: inline;
position: relative;
}
#first {
background-color: palegoldenrod;
padding-bottom: 500px;
width: 400px;
display: inline;
position: relative;
}
<div id="content">div id="content"
<div id="second">div id="second"</div>
<div id="first">div id="first"</div>
</div>
这里有一个的jsfiddle它的样子在现在。
查看更新 JSFiddle
#first, #second {
border: solid green 2px;
}
#content {
border: solid purple 2px;
clear: both;
}
#second {
background-color: yellow;
padding-bottom: 500px;
width: 100px;
position: relative;
float: right;
}
#first {
background-color: palegoldenrod;
padding-bottom: 500px;
width: 400px;
position: relative;
float: left;
}
#content::after {
content: "";
clear: both;
display: block;
}
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句