css - Table exceeds size of div because white space -
i'm having little problem here. well, need prevent wrap of elements presents in table, use white-space: nowrap;
. , here problem. table inside div:
<div class='content'> <table> <!--table elements goes here--> </table> </div>
in css, have:
div.content { background-color: #e6ebf2; padding: 20px; } table { width: 100%; margin-top: 20px; border-collapse: collapse; border-spacing:0; background-color: white; white-space: nowrap; } th, td { font-family: arial, sans-serif; font-size: 16px; padding: 10px; border-style: solid; border-width: 1px; border-color: #d6cece; overflow: hidden; }
the problem if resolution of screen small table, width of div content
not expanding according table size, disfiguring layout.
my result like:
but needs this:
using display: inline-block
works, can't align div on center. apreciate help, thanks!
i think in case, it's either no-wrap goes... or deal content going out of bounds of screen res. no-wrap doing it's job , width:100%
Comments
Post a Comment