如何在CSS中删除DIV后的换行符

有没有一种方法可以防止在使用css的div之后出现换行，但是一个div的最小宽度和另一个div的最大宽度

比如我有

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

我的文本向右浮动，标签占据所有剩余宽度

我正在使用以下CSS，但.text div一直在换行：

div
{
    display: inline-block;
}

.label {
    border:1px solid blue;
    width:100%;
}

.text {
    border:1px solid red;
float:right;
}

**更新：JS FIDDLE*

---

谢谢你的帮助

你看到的不是“断线”；这是因为

元素默认为

块
元素

如果要更改行为，使其显示在同一行上，可以更改CSS中的
display
属性，如下所示：

display:inline;

或

如果您仍然希望具有
width
或
minwidth
属性（如问题中所述），则需要这两个属性中的后者，
inline block

希望对您有所帮助。
您可以使用CSS表格模型：

.label {
    border:1px solid blue;
    display: table-cell;
    width: 100%;
}

.text {
    border:1px solid red;
    display: table-cell;
    white-space: nowrap;
}

您需要将它们从
块
元素更改为
内联块
元素，就像这样。在向右推.text div时，如何设置.label div以占据所有屏幕宽度？像这样？是的，但是.标签需要占用所有剩余的宽度；这个解决方案不能做到这一点。谢谢我不知道你在问什么。它确实解决了，但它并不能解决我面临的包装问题。请参见此处：@alias51-在小提琴中，只需从标签上删除
宽度：100%
。就目前情况而言，它将标签扩展到整个屏幕的宽度，因此下一个元素当然会向下移动到下一行。或者，您可以对标签和字段使用
float:left
和
float:right
。
display:inline-block;

.label {
    border:1px solid blue;
    display: table-cell;
    width: 100%;
}

.text {
    border:1px solid red;
    display: table-cell;
    white-space: nowrap;
}