0

我有一个div里面有一些内容,并设置为white-space: nowrap;当这种情况发生时div保持相同的大小。我怎样才能使它div继续包裹到现在漂浮在页面右侧的内容的末尾?

.parent {
  border: 1px dotted blue;
}
.parent p {
  border: 1px dotted red;
  white-space: nowrap;
}
<div class='parent'>
  <p>This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text.</p>
  <p>This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text.</p>
</div>

4

3 回答 3

1

您可以设置.parent{display:inline-block;}是否希望边框一直到内容的右侧。

.parent {
  border: 1px dotted blue;
  display: inline-block;
}
.parent p {
  border: 1px dotted red;
  white-space: nowrap;
}
<div class='parent'>
  <p>This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text.</p>
  <p>This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text. This is some text.</p>
</div>

于 2016-07-18T16:09:40.470 回答
0

如果我正确理解您的问题,使用溢出:滚动可能会解决您的问题。

于 2016-07-18T15:27:47.823 回答
0

如果您的意思是在文本需要换div行之后需要内容,您可以尝试将 a 设置为后面的第一个(或添加一个元素来执行此操作)。nowrapdisplay: block

一个<br>标签也可以打破一个nowrap

但是,如果这是您的意图,那么如果您仅将一段文本设置为 nowrap,而不是整个 div,则可能会导致较少的问题。

于 2016-07-18T15:37:02.253 回答