html - 如何在一行上显示三个文本字段

Question

我试图在一行上显示三个文本字段。当屏幕较小时，这些文本字段应显示在同一行中。目前，当我将浏览器变小时，文本字段会移动到第二行。

我怎样才能做到这一点？

请看我的代码

HTML

<div class="fields">
    <input type="text" class="name" />
    <span>&ndash;</span>
    <input type="text" class="name" />
    <input type="text" class="name2" />
</div>

CSS

.fields {
    border: 1px solid grey;
    width: 23%;
}
.name {
    display: inline;
    width: 11ex;
}
.name2 {
    display: inline;
    width: 8ex;
}

Answer 1

给空白：nowrap；到你的.fieldsDIV。像这样写：

.fields {
            border: 1px solid grey;
            width: 23%;
            white-space:nowrap;
        }

检查这个http://jsfiddle.net/6tkF8/1/

Answer 2

这解决了您的问题：

.fields {
  display: inline;
}