valign for contents...help plz

liunx

Guest
ok this has been a big problem for me and ive been "cheating" my way thru it (by making blank tables)<br />
<br />
how do i vertically center the contents of my site...say its one table 400x400pixels<br />
w/out using div's (cos i had problems with them grrr)<br />
<br />
anyone have any ideas? :confused:<!--content-->Try this one:<br />
<table border="0" width="100%" height="100%"> <!--makes a 100% box //--><br />
<tr><br />
<td align=center><!--if you don't use the valign attribute the default is valign=middle, you can change it to:top,bottom,middle //--><br />
<table border="1" width="400" height="400"><br />
<tr><br />
<td align=center>this should be centered!</td><br />
</tr><br />
</table><br />
</td><br />
</tr><br />
</table><!--content-->thanks! that worked perfectly :)<!--content-->Originally posted by dd014 <br />
<br />
how do i vertically center the contents of my site...say its one table 400x400pixels<br />
w/out using div's (cos i had problems with them grrr)<br />
<br />
<br />
Do you mean this doesn't work?<br />
<br />
<div style="position:absolute; top:50%; left:50%; width:400px; height:400px; margin:-200px 0 0 -200px;"><br />
<br />
</div><!--content-->Originally posted by swon <br />
<br />
<td align=center><!--if you don't use the valign attribute the default is valign=middle, you can change it to:top,bottom,middle //--> <br />
<br />
No, valign="middle" is definitly NOT the default (even if the HTML spec sais so).<br />
IE 6, Opera 7b2 and Gecko ALL default to the correct CSS-default {vertical-align:baseline}.<br />
Mayby there is some old browsers out there still in use that default to middle, but modern browsers don't (unless you use broken code to force them to render the page in non-standards mode).<br />
<br />
You are most welcome to verify that with eg this examplecode<br />
<br />
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"><br />
<html><br />
<head><br />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><br />
<meta http-equiv="Content-Script-Type" content="text/javascript"><br />
<meta http-equiv="Content-Style-Type" content="text/css"><br />
<title></title><br />
<link href=http://www.webdeveloper.com/forum/archive/index.php/"main.css" rel="stylesheet" type="text/css" title="Default" media="screen"><br />
</head><br />
<body><br />
<br />
<table border="0" width="100%" height="100%"><br />
<tr><br />
<td align=center><br />
<table border="1" width="400" height="400"><br />
<tr><br />
<td align=center>this should be centered!</td><br />
</tr><br />
</table><br />
</td><br />
</tr><br />
</table><br />
<br />
</body><br />
</html><br />
<br />
<br />
The fix is of cource to use eg <br />
td {vertical-align:middle}<br />
in your stylesheet.<!--content-->
 
Top