CSS框的高度应该动态设置

Question

我想创建一个最大宽度为200px的div；如何自动增加 div 的高度？有人可以帮助我应该使用哪些 css 属性吗？

我的用例是我的盒子宽度应该是恒定的，但我保留在盒子里的文本不应该从盒子里出来，如果多余的话盒子的高度应该动态增加？

Answer 1

这很容易做到。您可以使用以下代码：

min-height: 100px;
overflow: hidden;

如果无法解决请告诉我，我会帮助您。

Answer 2

如果您设置了 div 的宽度，它的高度将自动调整以适合内容。您无需执行任何操作即可实现此功能。

div {
  max-width: 200px;
  /* For clarity */
  border: 1px solid black;
}

<div>Hello</div>

<div>Lorem ipsum dolor sit amet, consectetuer adipiscing elit.</div>

<div>
  Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam quis nulla. Nullam justo enim, consectetuer nec, ullamcorper ac, vestibulum in, elit. Etiam dui sem, fermentum vitae, sagittis id, malesuada in, quam. Cras pede libero, dapibus nec, pretium
  sit amet, tempor quis. Vestibulum fermentum tortor id mi. Mauris dictum facilisis augue. Etiam quis quam. Morbi leo mi, nonummy eget tristique non, rhoncus non leo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
  Duis sapien nunc, commodo et, interdum suscipit, sollicitudin et, dolor. Curabitur sagittis hendrerit ante. Integer vulputate sem a nibh rutrum consequat. Nulla quis diam. Mauris elementum mauris vitae tortor. Aenean placerat. Nunc tincidunt ante vitae
  massa. Pellentesque sapien. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Cras elementum. Mauris dolor felis, sagittis at, luctus sed, aliquam non, tellus. Itaque earum rerum hic tenetur a sapiente
  delectus, ut aut reiciendis voluptatibus maiores alias consequatur aut perferendis doloribus asperiores repellat. Mauris elementum mauris vitae tortor. Integer imperdiet lectus quis justo. Duis risus. Etiam egestas wisi a erat. Class aptent taciti sociosqu
  ad litora torquent per conubia nostra, per inceptos hymenaeos. Morbi scelerisque luctus velit.
</div>

Answer 3

div {
    max-width: 200px;
    width: auto;
    word-wrap: break-word;
}

看看这个方法。