我想創建一個使用柔性盒模型的輸入機制。我知道這不是所有瀏覽器都支持的，但在這種情況下並不重要。它確實只需要在Web瀏覽器上工作。兩列輸入與柔性盒模型
我想建立一個很好的兩列布局，而不需要使用特定的寬度。我的flex屬性在標籤和輸入上都設置爲1。但是，正如您所看到的那樣，當標籤元素變長時，會混淆它旁邊的輸入寬度。
我希望標籤和輸入的列寬相同，但我希望它們隨着窗口/設備大小的變化而變大和縮小。
有沒有辦法做到這一點，而不必在任何一個元素上設置width？
更新
我可以設置標籤上的元素max-width到5％，我基本上得到想要的效果。不過，我仍然想知道是否有一種方法可以在不設置任何寬度的情況下使用純彈性盒？
Here是一個工作jsFiddle。
您提供的示例根本沒有列，只是有列的外觀。沒有實際的列，你將不得不設置寬度，以使這3個未被刪除的塊看起來以某種方式加入。
您應該使用新的CSS3 Flexible Box語法，該語法現在'flex'而非'box'。看到規格：http://www.w3.org/TR/css3-flexbox/有了這個，你可以設置的元素有一個50％，因此它們會以相同的速度增長和收縮，並將分別佔用50％的可用寬度（你可以調整它或使它成爲60/40或其他）。
例的jsfiddle：http://jsfiddle.net/XTa98/4/
否則，如果你想要的實際列，這樣你就不必設置寬度，你需要用所有自己的「列」 DIV標籤和所有的投入在他們自己的「專欄」中。
的jsfiddle：http://jsfiddle.net/XTa98/5/
這樣做的實際列，沒有寬度設置，但它並沒有正常降級了，因爲要素在自己的行不。爲了減輕這一點，你總是可以提供text-overflow: ellipses截斷文本。
無論如何，你有一個權衡。如果你想在不實際使用列的情況下顯示列，則需要設置某種類型的寬度。否則，您可以使用實列，但元素不再以行的形式連接，並且在縮小瀏覽器寬度時需要考慮溢出。
您不必在列div中包裝元素以避免設置寬度。只需設置每個標籤並將其輸入爲flex：1，就可以使它們平均分配寬度。但是，實際上這與將每個設置爲50％寬度相同，在這種情況下，我不確定它的真正優勢。