css - liquid form layout with display:inline-block -
i have got form label container , value container in 1 row , have made fiddle illustrate: http://jsfiddle.net/eeven/3/
the layout fixed , never want value container wrap under label container. since both containers set inline-block
can white-space:nowrap
list row (see fiddle) , goal partially acomplished. partially, because in value container want text wrap if browser not wide enough hold text in 1 line. thought white-space:normal
value container, dosn't work... , reimains in nowrap
fashion.
what can make work alright?
i've solved using css table display (i.e. table-row , table-cell). solution misbehave in older ie versions.
li { display: table-row; } .field_label { display: table-cell; min-width: 140px; background: yellow; } .field_widget { display: table-cell; background: cyan; }
solution using css tables http://jsfiddle.net/ecssv/
solution using html tables http://jsfiddle.net/vrhmm/ should work in older ies
Comments
Post a Comment