Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations Mike Lewis on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

vertically aligned table problem 1

Status
Not open for further replies.

moron3

Technical User
Dec 2, 2008
17
US
The code below aligns a table exactly how I want and works in all browsers. The problem is when I open a link from that page to another page that uses the exact same method, the top of the table on that page will be at the very top of the page, not vertically aligned. If you hit the brower's refresh button, it will vertically align, but that's no good.

Is there a fix for this problem? Or do you know of a better way to vertically align a table that works in all browsers?


<body bgcolor="#000000" topmargin="0" leftmargin="0">

<table border="0" width="100%" id="table1" cellpadding="0" style="border-collapse: collapse" height="100%">
<tr>
<td>
<div align="center">
<table border="0" width="100%" id="table2" cellpadding="0" style="border-collapse: collapse" height="500" bgcolor="#000000">
<tr>
<td>
<p align="center"><font color="#FFFFFF">Table contents here</font></td>
</tr>
</table>
</div>
</td>
</tr>
</table>

<p align="center"><a target="_blank" href="artmuseum.htm"><img border="0" src="itsok.png" width="273" height="14"></a></p>
<p align="center">&nbsp;</p>
<p align="center">&nbsp;</p>

</body>
 

This is the best method of vertical align I've seen. If you wish to use only tables, try giving all your parent elements (html, body) height of 100% and use vertical align on the holding table. I would however advise the above described code.

___________________________________________________________
[small]Do something about world cancer today: Comprehensive cancer control information at PACT[/small]
 
that looks good and works good but I don't see how to make the container bigger. If I try to put a bigger picture in there it throws it all off.

looks like there's absolute height/width values like this

margin-bottom:-13.75em; /* half of container's height */

which I don't understand that you have to adjust to make the box bigger and still have it be vertically aligned?
 
ok I got. I had a headache and didn't see the height/width values below it. *duh*
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top