html - 在单行填充空间中显示两个 div - CSS

Question

我有两个 div diva 和 divb。它们的高度固定为 30px。我想在一行中显示它们，一个接一个。这可以通过分别为它们指定 10% 和 90% 的宽度以及 float: left 来完成。这很好用。但是我给了它们一个 1 px 的边框，这会扰乱计算。我将第二个 div 的宽度设置为 88% 并且可以正常工作。但是那个div之后有一个空白区域。

我希望两个 div 都显示在一行中。页面重新调整大小，我希望 div 填充空间，这样我就不能给它们固定宽度。第一个 div 可能会被赋予一个固定的宽度，因为我只想让它 150 px 宽。但是第二个 div 必须更宽才能填充空间。

我得到的是这个；

我想要这个:

Here 是 fiddle 。

Answer 1

在正文中添加一个 width: 100% 并在 div1 上指定 float: left; 并删除 float: left; 在div2.

如果您在子元素上使用百分比宽度或高度，您还必须在父元素或容器元素上指定百分比宽度或高度。

应该可以解决! :)

See this fiddle here

祝你好运!