problem with my page's navbar.

**mr.humble** · Sep 12, 2007 16:52

Hello,

i have problem with my links in the page's navbar , i want to put my links in the middle of navbar, but i always see my links in the top of it.

i was used all the ways to fix the problem, but i failed.

this is an simple example, u can see the problem :

Code HTML4Strict:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" dir="ltr"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta http-equiv="Content-Language" content="EN-US" /> <title>example</title> <style type="text/css"> body { background: pink; font-family: "Times New Roman", Times, serif; font-size: medium; color: #B5C3CE; font-weight: bold; text-decoration: none; } #main { border: 1px double #000000; background: red; height: 350px; width: 777px; margin: auto; } .nav { background: white; height: 50px; width:777px; text-align:center; } a { color: red; text-decoration: none; } a:hover { color: black; text-decoration: underline; } </style> </head> <body> <div id="main"> <div class="nav"><a>forum</a></div> <div> </body> </html>

can i find help ? i hope that.

thanks for reading my subject...

**markbrown4** · Sep 12, 2007 17:29

Hello, and welcome to Sitepoint

You can vertically center text in an element with line-height.

Code:

.nav {
	background: white;
	height: 50px;
	width:777px;
	text-align:center;
}
.nav a { line-height: 50px }

You also need to close your #main div with </div>

Hope it helps

**mr.humble** · Sep 12, 2007 17:40

thanks, mark!

**markbrown4** · Sep 12, 2007 17:40

You're most welcome

User Tag List

Thread: problem with my page's navbar.

Thread Tools

Display

problem with my page's navbar.

Bookmarks

Bookmarks

Posting Permissions