Question

.containerdiv{
white-space: nowrap;
}

.childdiv{
display : inline-block;
}

<div class="containerdiv">
   <div id="child1" class="childdiv"></div>
   <div id="child2" class="childdiv></div>
</div>

我不想要孩子div包装。因此创建了如上所述的CSS。

在div“child1”中的

我指定在不同位置变化的宽度。为了防止div child2超出容器我想在child2中指定最大宽度。即。不超过父div。（我无法计算并提出）我怎样才能实现这一目标。我能看到的是现在div child2比父容器更多。如何防止这种情况？

请帮忙。提前谢谢。

Answer 1

如果你想让它非常开心，你可以做内联块并希望最好。

但如果内容太宽，可能只是将内联块推到下一行

<强>解

#containerdiv {overflow:auto;}/*the clear fix*/
#containerdiv>div {float:left; width:50%;}

在那里，它们都占据了50％的容器并且溢出自动清除它。

您可以使用50％进行内联块，但需要销毁水平空格。

<div><div></div></div>

这是有效的，因为它们之间没有空格

<div>
<div></div><!--
--><div></div>
</div>

这是有效的，因为注释删除了空格。

当使用带有nowrap的内联块时，子div超出了父div

1 个答案: