textarea不擴展以包含內容

如何使兩個textareas動態填充指定的空間。在真實頁面上，第二個textarea不包裹，所以它的寬度無關緊要。但是，如何讓數字框擴展到最長的數字所需的寬度？textarea不擴展以包含內容

#container{ 
    width:250px; 
    border:1px solid black; 
} 
textarea{ 
    float:left; 
    height:150px; 
    font-family:monospace; 
    text-align:right; 
} 
#t1{ 
    width:auto; 
    min-width:10px; 
    max-width:50px; 
    margin-right:4px; 
} 
#t2{ 
}

width:auto似乎不起作用。而我的min-width和max-width的實驗也是徒勞的。

JSBIN

來源

2013-10-26 1252748

你應該發表一個搗鼓您的問題 – Rex

@Rex有一準備好，只是忘了提醒掛靠><謝謝！ – 1252748

textareas爲什麼需要這樣做？您似乎正在使用它們來顯示數據，而不是要求用戶輸入。例如，使用textarea來達到這個目的往往會導致你不會用'div'的問題。 –

嘗試使用box-sizing: border-box與百分比寬度：

textarea { 
    -webkit-box-sizing: border-box; 
    -moz-box-sizing: border-box; 
    box-sizing: border-box; 
    width: 50%; 
}

爲#t1和#t2刪除特定的風格，如果需要，你可以爲每個指定寬度，總結高達100％。

更新jsbin：http://jsbin.com/udeLafO/19/edit

來源

2013-10-28 15:03:52 idotpdot

textarea不擴展以包含內容

回答

相關問題