防止文字換行，最小寬度？

我剛剛開始使用網絡，我的第一個任務之一是修復一些跨瀏覽器UI問題。在Firefox和Internet Explorer，該代碼看起來不錯：防止文字換行，最小寬度？

<div id="readTypeBtns" style="text-align: left;margin-left: -30px"> 
    <label class="radio inline"> 
    <input value="First Read" id="firstread" type="radio">First Read</label> 
    <label class="radio inline"> 
    <input value="Second Read" id="secondread" type="radio">Second End</label> 
</div>

當我看到這個在Chrome中，文本閱讀並重讀自動換行，這使得單選按鈕和文本不能在同一行。我想知道爲什麼會發生這種情況。我玩了一段時間，我看到我可以爲每個硬編碼一些最小寬度，但對我來說這似乎不是一個「最佳」解決方案。有什麼想法嗎？提前致謝！

來源

2013-03-28 Crystal

''輸入'裏面的'標籤'是正確的。 – 2013-03-28 04:39:45

@DipeshParmer：我相信這很好，但在標籤之外添加輸入標籤可能更好。有哪些更好的意見存在分歧。這個想法是建立語義語境，但我不同意這樣做。使用匹配的ID是建立語義（和邏輯）上下文的另一種方式。 – 2013-03-28 04:41:27

@DipeshParmar是將輸入放置在標籤內是有效的HTML。 – 2013-03-28 04:41:34

-1

嘗試的代碼更改爲此：

<div id="readTypeBtns" style="text-align: left;margin-left: -30px"> 
    <label class="radio inline" for="firstread">First Read</label> 
    <input value="First Read" id="firstread" type="radio"> 
    <label class="radio inline" for="secondread">Second End</label> 
    <input value="Second Read" id="secondread" type="radio"> 
</div>

基本上<label></label>不應包含輸入，而應包括for=""屬性，包括輸入的id它是一個標籤。

來源

2013-03-28 04:41:44