CSS Forum

**WHPFord** · 01:00 AM

Edit. After asking this question on another forum and scrapping what I had done in favor of a different way of showing navigation images it looks fine now. So...never mind.
_____________________
This is the page with the problems: http://www.archfinds.com/RR/

I've been trying to get this to work for a few hours now. I've gotten it closer to correct but can't seem to make it work.

The images to the top and bottom of the navigation links should be in line with the navigation links so that it continues the line. Then the whole thing should be centered on the page.

I also need my top image centered and couldn't figure that out...I know it's something simple I'm missing.

here's my css:

Code:

p:first-letter 
{
color: #3f94cc;
font-size:xx-large;
font-family: Arial, Helvetica, sans-serif;
}

div.main
{
width:700px; 
border:0px black;
line-height:150%;
margin-left: auto;
margin-right: auto;
margin-top: 20px;
margin-bottom: 1em;
text-align: justify;
}

#header
{
background: url(images/header_01.gif);
background-repeat:no-repeat;
background-attachment:relative;
background-position:top center; 
width: 800px;
height: 138px;
}

#headerlinks
{
width:700px; 
border:0px black;
line-height:150%;
margin-left: auto;
margin-right: auto;
margin-top: 20px;
margin-bottom: 1em;
text-align: justify;
}

#navbar {
    font-family:Arial, Helvetica, sans-serif;
    font-size:.8em;
    font-weight:bold;
    height:59px;
}
#navbar li {
    list-style:none;
    display:inline;
}
#navbar a {
    width:99px;
    color:#3f94cc;
    text-decoration:none;
    background:url("http://www.webmaster-talk.com/images/links_09.gif") no-repeat;
    float:left;
    padding:18px 14px 14px;
    margin:0 -15px;
}
#navbar a:hover { 
    background-position:0 -59px;
    color:#1e5ebd;
}
#navbar a:active {
    background-position:0 -59px;
    color:#1e5ebd;
}