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

Question

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

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

谢谢。

Answer 1

我只是结合了之前的回答，它对我有用。就我而言，我不想对任何像素值进行硬编码，而是让我的子元素保持流动以增大和缩小到其父元素宽度。

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

还注意到，孩子不必是父母的直接孩子才能发挥作用。根据记录，我的父元素是一个 Flex 容器，flex-basis: 66%;它可以转换为 Flexbox 概念中的相对宽度。

Answer 2

将以下 CSS 应用到父 div：

overflow: hidden;

或者您可能想尝试max-widthchild-div 上的 CSS 属性。