如何使这些元素紧挨着别人,不低于对方的?
how to align these elements next to each others and not below each others?
<form action="http://xx.xxx.com/checker.php" method="post">
<input type="hidden" name="tokenz" value="9oaisdkjasiduqasdkjiwue" />
<input type="hidden" name="directz" value="true" />
Domain: <input type="text" name="domain" size="20" /> <select name="ext">
<option>.com</option>
<option>.org</option>
<option>.net</option>
<option>.biz</option>
<option>.info</option>
<option>.us</option>
<option>.pw</option>
<option>.in</option>
<option>.name</option>
<option>.mobi</option>
<option>.asia</option>
</select>
<input type="submit" value="Go" />
</form>
感谢
Many thanks
该表单只包含内联元素。这意味着它们都将保持在同一行,直到它们包裹
The form contains inline elements only. This means they will all remain on the same line, until they wrap.
如果你想prevent包装,尽量空白:NOWRAP
并为容器的宽度
If you want to prevent wrapping, try white-space: nowrap
and give the container a width.
小提琴
http://jsfiddle.net/Ballcheck/XbzdK/
HTML
<form action="http://xx.xxx.com/checker.php" method="post">
<input type="hidden" name="tokenz" value="9oaisdkjasiduqasdkjiwue" />
<input type="hidden" name="directz" value="true" />
Domain: <input type="text" name="domain" size="20" /> <select name="ext">
<option>.com</option>
<option>.org</option>
<option>.net</option>
<option>.biz</option>
<option>.info</option>
<option>.us</option>
<option>.pw</option>
<option>.in</option>
<option>.name</option>
<option>.mobi</option>
<option>.asia</option>
</select>
<input type="submit" value="Go" />
</form>
CSS
form {
white-space: nowrap;
border: 1px solid red;
width: 200px;
}