I have a styled table in a page for my site. For some reason, it seems to be floating above the #footer div that is supposed to be underneath it.

I cant understand why though, as it isnt even floated??

Any help would be great!

Here is a link to the page:
http://inspindesign.zidev.com/test/work/flash/

Here is my code:

table {border:#46A1B8 solid 1px;border-collapse:collapse;width:95%;}
table th, table td {border-bottom:#46A1B8 solid 1px;padding:2px;text-align:left;}
table th {background-color:#97D2E0;}
th.project {width:150px;}
table td {vertical-align:top;}
table p {margin:0;}

ohhhh nooooooooo its doing it on other pages aswell!!

http://inspindesign.zidev.com/test/guestbook/

Im sure all of these pages use to work fine, I dont remember making any drastic changes that should affect it like this??

Well,It seems that you have missed a </div> in your guestbook page.


And I really don't know what happan in ur work page,too.Sorry,can't help u.

But mayb u can add a new class outside the table.

like this:

<div class="box">
<table>
........
</table>
</div>

Try it.Mayb it can work.

Thanks I added in the extra </div> tag, and it fixed it a little bit!

the problem is still there though, on the prices and guestbook page aswell!

I just read ur css file.And I found this

#content {width:100%;clear:left;margin:0;height:200px;}

I think you have to delete the "height" of the content box.Only in this way can be fixed in FF.