我想知道如何让两个子 div 共享一个父 div。
我希望左栏包含来自数据库的文本(一个词)。这可能是 1-10 个字母长。由于我希望左列宽度完全适合单词，因此我没有给它设置宽度。
然后，我试图让正确的列填充剩余空间。
有没有简单的方法来做到这一点？
我不确定如何设置右列的 css 来实现这一点。
<div id="parent_div" style="width: 100px; height: 100px;">
<div style="background-color:blue; float:left;" id="left_column">
blue
</div>
<div style="background-color:red; float: left;" id="right_column">
red
</div>
</div>
我读到你不应该在没有给它设置宽度的情况下让它 float ，但似乎我想要的东西是不可能的。
谢谢
最佳答案
我想如果你不 float 第二个 div，你会得到你想要的效果。
<body>
<div id="parent_div" style="width: 100px; height: 100px;">
<div id="left_column" style="background-color: blue; float: left;"> blue </div>
<div id="right_column" style="background-color: red;"> red </div>
</div>
</body>
在 Firefox 中，这正是您想要的。红色列占据了蓝色列未占据的任何剩余空间。
关于css - HTML:拆分父 div "fluidly"，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/1015792/