birdbrain
msg:3297577 | 5:15 pm on Mar 30, 2007 (gmt 0) |
Hi there knotthead, and a warm welcome to these forums. ;) have a look at this example, it may help....
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><style type="text/css">
#links {
border:1px solid #999;
text-align:center;
line-height:60px;
}
#links a {
margin:0 20px;
color:#666;
background-color:#fff;
}
</style> </head>
<body> <div id="links">
<a href="#">link one</a>
<a href="#">link two</a>
<a href="#">link three</a>
<a href="#">link four</a>
</div> </body>
</html> |
|
birdbrain
|
knotthead
msg:3297596 | 5:21 pm on Mar 30, 2007 (gmt 0) |
Birdbrain. Thanks for the warm welcome and the code. Works perfectly! I am not sure why I could not find "text align: center" anywhere in the CSS DIV styles in the way of links/text out there in the WWW abyss. I have a column with links cascading down and I need them to justify to the right (with padding) and center valign. This works out great! Thanks so much! knotthead
|
birdbrain
msg:3297628 | 5:30 pm on Mar 30, 2007 (gmt 0) |
No problem, you're welcome. ;) p.s. it is the line-height that does the vertical centering.
|
Dabrowski
msg:3297726 | 6:53 pm on Mar 30, 2007 (gmt 0) |
Thanks birdbrain for your concise explanation. 'text-align: center' relates to horizontal positioning. 'line-height' specifies the height, in this case 60px, of each line of text. The text will be vertically centered within this line. This method works well and is certainly easiest for single lines of text. However if you had a paragraph that wrapped to 3 lines, it would make the paragraph 180px high! I think you can use 'display: table-cell' and 'vertical-align: middle' but I don't think it works in IE.
|
|
