强制标签与他们标记的输入内联流动 [英] Forcing label to flow inline with input that they label

问题描述

我需要标签与他们标记的输入字段保持在同一行.我希望这些元素在窗口调整大小时像往常一样流动，我只希望标签贴在它们标记的输入的左侧.我该怎么做?有什么想法吗?

label1:<input type="text" id="id1"/><label for="id2">label2:</label><input type="text" id="id2"/>

回答:Josiah Ruddell 的答案是正确的，使用 span 而不是 div 给了我正确的行为.谢谢！

<label for="id1">label1:</label><input type="text" id="id1"/></span><span style="white-space:nowrap"><label for="id2">label2:</label><input type="text" id="id2"/></span>

解决方案

把它们都放在一个 div 和 nowrap 中.

<label for="id1">label1:</label><input type="text" id="id1"/>

I need the label to stay on the same line as the input field they are labeling. I want these elements to flow like they normally would when the window resizes, i just want the label to stick to the left of the input they are labeling. How would I do that? Any ideas?

<label for="id1">label1:</label>
<input type="text" id="id1"/>
<label for="id2">label2:</label>
<input type="text" id="id2"/>

ANSWERED: Josiah Ruddell's answer was on the right path, using a span instead of div gave me the correct behavior. Thanks!

<span style="white-space:nowrap">
    <label for="id1">label1:</label>
    <input type="text" id="id1"/>
</span>
<span style="white-space:nowrap">
    <label for="id2">label2:</label>
    <input type="text" id="id2"/>
</span>

解决方案

put them both inside a div with nowrap.

<div style="white-space:nowrap">
    <label for="id1">label1:</label>
    <input type="text" id="id1"/>
</div>

这篇关于强制标签与他们标记的输入内联流动的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！