Question

我为<div>和min-height指定了样式的width，但是即使使用{{1 }}设置。我的代码的相关部分如下所示：

CSS：

<div>

HTML：

overflow-wrap: break-word

我是否在父元素上设置了不正确的属性，以防止其中的文本正常中断？

JsFiddle查看完整示例。

Answer 1

如果我正确理解了您的问题，则似乎您缺少控制wrapping behaviour of white spaces的CSS规则。考虑使用添加的white-space:normal规则更新CSS：

.card {
  display: block;
  padding: 2px 4px 2px 4px;
  box-sizing: inherit;
  max-width: 90%;
  min-height: 150px;
  border-radius: 4;
  border: #000 3px solid;
  margin: 4px 4px 10px 4px;
  font-family: Arial, Helvettica, sans-serif;
  font-size: 14px;
  overflow-wrap: auto;

  /* Add this */
  white-space:normal; 
}

.card > p {
  box-sizing: inherit;
  max-width: 100%;
  overflow: wrap;

  /* Add this */
  white-space:normal; 
}

应用上述更改会导致.card和.card > p的文本内容在遇到换行符时换行。希望这会有所帮助！

CSS溢出包装不包装内容

1 个答案: