防止</ div>之后的换行

有没有办法防止在使用div的div之后换行？

例如我有

<div class="label">My Label:</div>
<div class="text">My text</div>

并希望它显示为：

我的标签：我的文字

display:inline;

要么

float:left;

要么

display:inline-block; -可能不适用于所有浏览器。

div在这里使用a的目的是什么？我建议使用a span，因为它是行内元素，而a div是块级元素。

请注意，以上每个选项的工作方式都不同。

display:inline;会变成div等价于span。这将是不受影响margin-top，margin-bottom，padding-top，padding-bottom，height，等。

float:left;将保留div为块级元素。它仍然会像块一样占用空间，但是宽度将适合内容（假设width:auto;）。可能需要clear:left;一定的效果。

display:inline-block;是“两全其美”的选择。将div被视为一个块元素。它响应所有的margin，padding和height人们所期待的块级元素的规则。但是，出于放置在其他元素中的目的，它被视为嵌入式元素。

阅读此以获得更多信息。

.label, .text {display: inline}

尽管如果使用它，则最好将div更改为span。

默认情况下，DIV是BLOCK显示元素，这意味着它位于自己的行上。如果添加CSS属性display：inline，它将按照您想要的方式运行。但是也许您应该考虑使用SPAN？

<span class="label">My Label:</span>
<span class="text">My text</span>

的div元件是块的元素，所以默认他们采取UPP全部可用宽度。

一种方法是将它们变成内联元素：

.label, .text { display: inline; }

这将与使用span元素而不是div元素具有相同的效果。

另一种方法是浮动元素：

.label, .text { float: left; }

这将改变元素宽度的确定方式，因此宽度仅与元素内容一样宽。它还将使元素彼此浮动，类似于图像彼此并排流动。

您也可以考虑更改元素。该div元素用于文档划分，我通常将label和span元素用于这样的构造：

<label>My Label:</label>
<span>My text</span>

div用于赋予网站结构或包含大量文本或元素的功能，但您似乎将它们用作标签，则应使用span，它将自动将两个文本彼此紧挨着，并且您不需要赖特的CSS代码。

即使其他人告诉您浮动元素，最好也只需更改标签。

我认为我没有看过这个版本：

<div class="label">My Label:<span class="text">My text</span></div>

<div id="hassaan">
     <div class="label">My Label:</div>
     <div class="text">My text</div>
</div>

CSS：

#hassaan{ margin:auto; width:960px;}
#hassaan:nth-child(n){ clear:both;}
.label, .text{ width:480px; float:left;}

尝试将clear:nonecss属性应用于标签。

.label {
     clear:none;
}

尝试将div浮动到CSS中

.label {
float:left;
width:200px;
}
.text {
float:left;
}

我多次通过使用float css属性和width css属性来成功获得div且没有换行符。
当然，在制定解决方案之后，您必须在所有浏览器中对其进行测试，并且在每个浏览器中都必须重新调整窗口大小，以确保该解决方案在所有情况下均有效。

将此代码用于普通div display: inline;

如果您在表中display: inline-table; 比在表中更好地使用它，请使用此代码

尝试这样做（在中CSS）以防止div文本中出现换行符：

white-space: nowrap;