Table Padding-Bottom not working

HTML & CSS
1

Hi, i am trying to get space after a table.

Currently i have a table followed by a header. For some reason there is no space between the table and the header, in IE and FF, so this is something i am doing wrong but dont know what.

I have the following code:

<h3>Tier Classifications Standards</h3>
<table>
<tbody>
<tr>
<td> </td>
<td>Tier 1</td>
<td>Tier II</td>
<td>Tier III</td>
<td>Tier IV</td>
</tr>
<tr>
<td>Redundant Backbone Pathways</td>
<td>Not Required</td>
<td>Not Required</td>
<td>Required</td>
<td>Required</td>
</tr>
</tbody>
</table>
<h3>Flexibility</h3>

and the following CSS styles are shown in firebug:

#content table {
border: 1px solid black;
font-size:1.3em;
padding:0 0 45px !important;
}

table {
border-collapse:collapse;
border-spacing:0;
}

#content h3 {
font-size:1.2em;
font-weight:bold;
margin-bottom:0.5em;
}

h3 {
margin-bottom:1.6em;
}

I even added !important to the table padding incase cascade was overriding the property, but still the same result.

The actual page is here: http://www.foss.ae/wp/products-services/data-centre-services/ (the table is about half way down, just under the title ‘Tier Classifications’).

Any ideas? Many thanks in advance,

Chris

2

The code sample doesn’t match the page, and there are different problems with each…

In the code sample here, your table has to sit inside something with id=“content”, but you haven’t got anything with that ID.

On the page you’ve linked to, the CSS is for table.download-meta, but you don’t have a <table class=“download-meta”>, you’ve just got a <table>.

In both cases, the CSS declaration doesn’t match the table element, so the style is not applied.

3

Hi Dave,

Yes sorry for the confusion, im refering to the actual page which does have the correct DIV elements.

The code snippet isnt reflective of the actual page, it just shows the headers above and below the table.

I cant see any table.download-meta class at all, in my code editor i have

<h3>Tier Classifications &#8211; Uptime Institute &amp; TIA 942 Standards</h3>
<table>
<tbody>
<tr>
<td> </td>
...snip...

Regards,

Chris

4

Hi i fixed this with margin rather than padding:

Content table
{
table-layout:fixed;
border: 1px solid black;
font-size: 1.3em;
margin-bottom: 1.5em;
}

Cheers,

Chris