在以下代码中( https://jsfiddle.net/6t9n0wuu/ ):
#cont1 {
width: 50%
}
#div1 {
width: 10px;
float: left;
border: 1px solid black
}
#div2 {
float: left;
border: 1px solid black
}
<div id=cont1>
<div id=div1>a<br>b<br>c<br></div>
<div id=div2>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor
in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</div>
</div>
div2
的内容移至新行。
是否可以强制将 div2
置于顶部(即与 div1
位于同一行),而不在 CSS 中指定其宽度?
最佳答案
看看它是否适合你:--
#cont1 {width: 50%}
#div1 {width:10px;float:left; border:1px solid black}
#div2 {border:1px solid black;margin-left:12px;}
<div id=cont1>
<div id=div1>a<br>b<br>c<br></div>
<div id=div2>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</div>
</div>
您也可以使用 flex 盒。
关于html - CSS:强制 float:left 而不指定 div 宽度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45398798/