Hey guys,

Thanks to this website, my first CSS is almost completed.

Few things.

I need the top menu nav bar centered

Also, the blue bar on the botton, i would like the links to go on it. I would change the font to probably white.
The Copy right info would be under it with the lighter background color as it is right now.

I tried it for the past ~30 mins, but I didn't have any luck.


Also for the top menu bar, is there anyway I can make the background as the botton one? That would be a blue bar going across with the drop down menu on it. I would space it would somewhat evenly.
I would like to make the top nav bar right under the banner. So there would not be any space between them.

Thanks a lot

www.greenvillecopts.org/test

Well I got the nav bar centered by adding <center> before it's DIV. I'm sure that's not the proper way of doing it in CSS, since I would have to put the center tag in all my pages. I tried centering it from the style sheet, but I didn't have any luck.

To center the menu in CSS :
ul#navmenu {
margin: 0 auto;
border: 0 none;
padding: 0;
width: 500px; /*For KHTML*/
list-style: none;
height: 24px;
}
The 'auto' on the margin will center the 500px UL within the #navmenu... no need for the deprecated <center> any more

Also, the blue bar on the botton, i would like the links to go on it. I would change the font to probably white. The Copy right info would be under it with the lighter background color as it is right now.

Since your footer is a solid color, add background: #xxxxxx to the #footer rules. Then put your links in, as a list, inside the footer DIV.

Originally Posted by LadynRed

Since your footer is a solid color, add background: #xxxxxx to the #footer rules. Then put your links in, as a list, inside the footer DIV.

Like this?

<div id="line">
<ul>1
<li>link1</li>
<li>link2</li>
</ul>
</div>



#line {
height:35px;
font-size:0;
background-image:url(images/footer.gif);
background-color: #000000;
margin:10px 0;
}

? Thanks again

Yes, but for a solid color you don't need to make it a background image, just put in background: #426C7e.

Either way, putting the image in as the background for the div leaves you the space to put the link text ON TOP of the blue bar.

edit, nevermind.

I think I got it

Looks great !!

How do I get rid of the space under the banne?

Add this to your #header:
height: 104px;

Take out the 10px top margin on #line.

You should also always put in the width and height for your image in your html as well as the alt attribute to describe what the image is. At the very least, you should put the text that's in the graphic into the Alt text.