...

View Full Version : Nav Bar isnt aligning properly to other elements that are



DazednConfused
06-11-2012, 07:25 PM
I am using CSS and HTML on a site I am creating for a friend. You can see it here: http://krystlekleen.batcave.net/testpages

This is what my style sheet looks like, and it has done everything correctly except for centering that nav bar over top of the logo image.

body { background:#CCFFFF url(bkgdimg2.png) repeat-y;
background-attachment:fixed;
background-position:center; }

#foreground {
text-align: center; }

and here is my html code:

<link type="text/css" rel="stylesheet" href="stylet.css">
<style type="text/css">
ul{list-style-type:none;margin:0;padding:0;overflow:hidden;}
li{float:left;}a:link,a:visited{display:block;width:200px;font-weight:bold;
color:#9966FF;background-color:#6600CC;text-align:center;
padding:4px;text-decoration:none;text-transform:uppercase;}
a:hover,a:active{background-color:#6600CC;} </style>
</head>
<body>
<div id="foreground">
<ul><li><a href="#catalogue">Catalogue</a></li><li><a href="#contact">Contact Me</a></li></ul>
<img src="logo.png">

I'm not understanding what is going wrong, I used this same method on this page:http://krystlekleen.batcave.net for the nav bar and it works great. Any help is greatly appreciated. Thank you for reading

SeattleMicah
06-11-2012, 07:31 PM
I dont know if this is the fix you want but this will align your navigation center.


#foreground {
text-align: center;
}

change too


#foreground {
text-align: center;
margin:0 auto;
width:864px;
}

DazednConfused
06-12-2012, 07:15 PM
Thanks for the help, I did change the css code and that did left align the nav bars with the logo. So then I went into my html code and changed the width of the buttons to 415px, and that evened it out nicely. I appreciate the help :thumbsup:



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum