Forum Moderators: not2easy

Message Too Old, No Replies

Vertical Alignment in CSS

How do I do it?

         

Numberman

8:26 pm on May 12, 2004 (gmt 0)

10+ Year Member



I'm trying to place a container DIV exactly in the center of the browser window.
I used margin:auto to centre the container horizontally, but I can't find a way to centre it vertically. vertical-align doesn't seem to work in either FireFox or IE.

Numberman

9:20 pm on May 12, 2004 (gmt 0)

10+ Year Member



Greatly appreciated.

ergophobe

3:20 pm on May 22, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



DrDoc,

Awesome post! Seriously and for several reasons.

Tom

vkaryl

9:13 pm on May 22, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



Yup - flagging this one since I never did get around to going back to find these on my own.... *sigh* Glad Doc's not as lazy as I am!

Rambo Tribble

1:27 am on May 23, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



I have noticed that in many of the discussions it is said that vertical-align does not align one element within another. It does, however, align subordinate elements within a table cell. Example:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN""http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Untitled</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
<style type="text/css">
td{vertical-align:middle;width:400px;height:300px;border:4px solid blue;}
div{height:50px;width:50px;background:red;}
</style>
</head>
<body>
<table>
<tr>
<td><div></div></td>
</tr>
</table>
</body>
</html>

Otherwise, it is intended to determine the alignment of text within a line. Hence the subscript, superscript, baseline, etc. values.