css - Fixed table layout overflow to the side -
problem
i have fixed width table (which must be) , 1 of cells contains text long fit within it, overflows outside cell right.
i need have table cells' text aligned right.
i ideally don't want change of markup.
what i'm looking for
i'm in need of finding someway (text in example) "longlonglong" overflow left on other previous cells , maintain it's aligned right state.
code
html
<table width="120"> <tr> <td width="30">text</td> <td width="30">text</td> <td width="30">text</td> <td width="30">very longlonglong text</td> </tr> </table>
css
td { text-align: right; border: 1px solid black; vertical-align: top; } table { border: 1px solid red; table-layout: fixed; }
example
http://jsfiddle.net/xareyo/evkgz/
thankyou time.
see http://jsfiddle.net/evkgz/1/
<table width="120"> <tr> <td width="30">text</td> <td width="30">text</td> <td width="30">text</td> <td width="30"> <div id="container1"> <div id="container2">very longlonglong text</div> </div> </td> </tr> </table> td { text-align: right; border: 1px solid black; vertical-align: top; } #container1 { width: 30px; position: relative; } #container2 { float: right; overflow: visible; text-align: right; } table { border: 1px solid red; table-layout: fixed; }
Comments
Post a Comment