petwho petwho - 9 months ago 74
CSS Question

Set padding/margin for overflow table

I have a table that lives inside a div. That table has a huge content in it that overlap the window, so I need to scroll far to the left to see its content. Problem is that the table doesn't have a padding or margin on the right to make it more easier to read.

How can I add padding or margin to that table?

Here is the html looks like (Note that the css below doesn't work):

<div id="table">
table td, table th, table td {border: 1px solid red}
table { padding-right: 100px; border: 1px solid blue}
table thead, table tbody {padding-right: 100px;}

Answer Source

thank for your answer. However I see that doing it by via javascript is much easier and also very flexible. Here, I'm doing using jQuery framework:

 $('#table').width() = $('table').width() + 20;
 $('table').css('padding-right', '10px');

That will make the table width as it first intended to be.