css - 如果子宽度是动态的，如何使子 div 不超过其父宽度

Question

在我的 jsp 中，我有一个 div，其宽度由 javabean 值决定。基本上它被用来填充一个条。有时值大于 100，因此宽度变为 300%(例如)，从而超出父级的边界。

我需要知道如何限制子 div 的宽度，使其不超过父边界。

谢谢。

Answer 1

我只是结合使用了之前的回复，它对我很有效。在我的例子中，我不想对任何像素值进行硬编码，而是让我的子元素流畅地增长和收缩到其父元素宽度。

用于父级 overflow: hidden; 和子级 width: 100% !important;

还注意到，子项不必是父项的直接子项才能起作用。作为记录，我的父元素是一个带有 flex-basis: 66%; 的 Flex Container，它在 Flexbox 概念中转换为相对宽度。