时间戳

首页 > 解决方案 > 有没有办法让元素的内容在扩展宽度之前填充可用高度？

html - 有没有办法让元素的内容在扩展宽度之前填充可用高度？

问题描述

假设我有<div>一个最小宽度和一个固定高度。如果内容<div>变长，它会开始扩大宽度以适应。但是，即使该固定高度为更多的文本行留出了足够的空间，它也会扩大宽度，而不会使<div>宽度变宽。

有没有办法让内容在扩展宽度之前先尝试溢出到可用高度<div>？

<div class="container">
  Text
</div>

.container {
  display: inline-block;
  height: 3.6em;
  min-width: 150px;
}

标签： htmlcss

解决方案

假设您没有使用前端框架，即：Bootstrap。我通过添加 max-width 属性来提供以下解决方案。

.container {
  display: inline-block;
  height: 3.6em;
  max-width: 400px;
  min-width: 150px;
}

推荐阅读