css - Can't convert Table layout to DIVs -
css - Can't convert Table layout to DIVs -
i have simple form info input. labels inputs. labels localized, don't know how long text different languages be. problem solved table layout:
<table> <tr> <td> <label for="text1">short</label> </td> <td> <input id="text1" type="text" /> </td> </tr> <tr> <td> <label for="text1">looooooooong</label> </td> <td> <input id="text2" type="text" /> </td> </tr> </table>
no matter how long labels layout nice. many using table tag non tabular info not good. don't how solve problem divs.
<div> <div style="float:left; width:50px;"><label for="text3">short</label></div> <div style="float:left;"><input id="text3" type="text" /></div> <br style="clear:left;" /> </div> <div> <div style="float:left; width:50px;"><label for="text4">looooooooong</label></div> <div style="float:left;"><input id="text4" type="text" /></div> <br style="clear:left;" /> </div>
with solution need utilize fixed size divs. of cource can set big value label divs width, want ui takes much space needed. ideas?
the way nice, adjustable layout similar 1 html table (which semantically right here, should care this) utilize table layout in css, i.e. utilize display: table
, display: table-row
, etc. it’s obvious how that. have more limited browser back upwards html table.
any other approach has rigidity guess on widths of labels or entire... build has made.
css table html
Comments
Post a Comment