两个div彼此相邻，但第一个div进入第二行

I have a scenario where I have two divs. I would like the second div to immediately follow the first. Currently, the space I have to work with is small, so the text in the first div is too large for one line and it wraps to a second line. Event hough this occurs, I would like that second div to come directly after the first (and in this case after the end of the first div on the second line.

我有一个场景,我有两个div。我希望第二个div能够紧跟第一个。目前,我必须使用的空间很小,因此第一个div中的文本对于一行来说太大而且它包裹到第二行。事件发生这种情况时,我希望第二个div直接在第一个div之后(在这种情况下,在第二行的第一个div结束之后)。

<div id="one" style="display: inline-block;">
  <div id="two" style="float: left;"></div>
  <div id="three" style="float: left;"></div>
</div>

This works fine when the text is div with the id of two is small but when it is large it wraps to a second line and the div with the id of three goes below div two.

当文本为div且id为2时,这种方法很好,但是当它很大时,它会换行到第二行,而id为3的div会低于div 2。

1 个解决方案

#1

Change your

<div id="two" style="float: left;"></div>
<div id="three style="float: left;"></div>

To

<div id="two" style="float: left;"></div>
<div id="three"></div>

NOTE: You no need to float both the div to left

注意:您不需要将div向左浮动