我写了这段代码:
<body>
<div>
<div style="padding:10px;float:left;height:500px;background-color:#ff6a00;">
Div1 -> Floated
</div>
<div style="padding:10px;height:600px;background-color:#5c64bb;display:-webkit-flex">
Div2 -> Not Floated
</div>
</div>
结果是下图，我可以通过使用 -webkit-flex display 来实现这个结果，它只在 chrome 中工作，有没有什么想法可以给我同样的结果。
顺便说一句，我不想对 Div2 使用 margin-left 和绝对位置。
最佳答案
如果您不介意为左侧指定一个静态宽度，您可以通过以下方式实现右侧的 flex 类型布局:
<div style="display:table;width:100%;">
<div style="display:table-cell;width:130px;vertical-align:top;">
<div style="padding:10px;height:500px;background-color:#ff6a00;">
Div1
</div>
</div>
<div style="display:table-cell;vertical-align:top;">
<div style="padding:10px;height:600px;background-color:#5c64bb;">
Div2
</div>
</div>
</div>
关于css - float 和宽度 100%，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/19478527/