Forum Moderators: open

Message Too Old, No Replies

Table blows out when padding is added

         

Adam5000

12:59 pm on Apr 4, 2009 (gmt 0)

10+ Year Member



I'm trying to put a table inside a table and I'm having a problem with the padding.

What I'd like is to have 0% padding in the outer table, and 5% padding in the inner table.

The code below works with padding at 0%, but when I change the padding to 5%, the table blows out.

Help!

<html>
<head>
<title>Test</title>

<style type="text/css">

table
{
width: 100%;
}

td
{
border-style: solid;
border-width: 3px;
}

</style>

</head>

<body>

<table>
<tr>
<td>

<table>
<tr>
<td style="padding: 0%;">

Test

</td>
</tr>
</table>

</td>
</tr>
</table>

</body>
</html>

rocknbil

1:17 pm on Apr 4, 2009 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Not sure what you mean "blows out," it's doing what you tell it to - except that I think "5%" means 5% of the viewport width. Is it just too much space? try 1em or 2em; or even px:

/* td's inside another table */
table td table td { padding: 1em; }
/*or*/
/*table td table td { padding: 6px; }*/

Adam5000

2:48 pm on Apr 4, 2009 (gmt 0)

10+ Year Member



Thanks rocknbil.

The em worked. When I say blow out I mean the inner table cell becomes very large. Something maybe in the range of 20,000px X 20,000 px. Or maybe even bigger. And by using the percentages, I'm trying to keep it all on the screen with different size windows without the viewer having to scroll. I figure that not everyone is using the same size window to view the page, and that's fine. And I'm trying to keep it all on the screen on as many computers as I reasonably can.

I'm sure it's doing what I'm telling it to do, and I just didn't know how to tell it what I wanted.

Thanks again.
You're fantastic!