在单行填充空间中显示两个div - CSS [英] Display two divs in a single line filling space - CSS
问题描述
我有两个div diva 和 divb 。它们的固定高度为 30px 。我想将它们显示在一行，一个接一个。这可以通过分别给出 10％和 90％的宽度和 float ：left 。这工作正常。但我给他们一个 1 px 的边界，这扰乱了计算。我给第二个div的宽度 88％并且正在工作。但是在那个div之后有一个空白的空间。
I have two divs diva and divb. They have a fixed height of 30px. I want to display them in a single line, one after the other. This can be done by giving them widths of 10% and 90% respectively and by float: left. This works fine. But I gave them a border of 1 px and this disturbs the calculation. I gave the second div a width of 88% and is working. But there is an empty space after that div.
我想要在一行中显示两个div。页面大小，我想要div填充空间，所以我不能给他们固定的宽度。第一个div可以给定一个固定宽度，因为我只是想要 150 px 宽。
I want both the divs to display in a single line. The page re sizes and I want divs to fill space and so that I can't give them fixed width. The first div may be given a fixed width, because I just want it 150 px wide. But the second div must be wider to fill space.
我得到的是这个;
我想要这样：
这里 是小提琴。
Here is the fiddle.
推荐答案
向主体添加 width：100％，并指定 float：left; 在div1上，并删除div2上的 float：left; 。
Add a width: 100% to the body and specify float: left; on div1 and remove the float: left; on the div2.
如果您在子元素上使用百分比宽度或高度，则必须在父元素或者容器元素上指定百分比宽度或高度。
If you're using percentage widths or heights on child elements you have to specify a percentage width or height on the parent or rather container element as well.
修理它！ ：）
祝你好运！
这篇关于在单行填充空间中显示两个div - CSS的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
