PDA

View Full Version : Aligning Header background Image



Magicjax
16 Dec 2008, 01:54 PM
Hi everyone.

I'm hoping I can find some help in getting a background header image aligned. Right now it's kind of centered but I need it to be all the way to the far left.

Go here and you'll see it. It's the image of the drawing (http://ronjaxon.info/). I need it moved over to the left side instead of in the center.

Here's the Stylesheet code Header section:

#content
{
margin: 0 auto;
width: 742px;
text-align: left;
}

#back
{
width: 827px;
}

#header {
height: 581px;
margin-top: 81px;
text-align: left;
}

#menu
{
width: 752px;
height: 44px;
padding-left: 120px;
padding-top: 30px;
background: url(images/menu.gif) no-repeat;
}

#menu ul {
list-style: none;
}

#menu li {

display: inline;

}

#menu a {
float: left;
width: 120px;
height: 32px;
display: block;
text-align: center;
text-decoration: none;
color: #000000;
font-weight: bold;
font-size: 14px;
text-transform: uppercase;
}

#menu a:hover {
width: 120px;
height: 32px;
color: #ff0000;
text-decoration: underline;
}



#logo {
background: url(images/header.jpg) no-repeat;

width: 852px;
height: 399px;
text-align: left;
padding-left: 20px;
padding-top: 10px;
margin-bottom: 67px;

}


#logo a {
text-decoration: none;
text-transform: lowercase;
font-style: italic;
font-size: 18px;
color: #000000;
}
#logo H2 a
{
font-size: 12px;
}
[/CODE]

Here's the header from the HTML:

<div id="content">
<div id="back">
<!-- header begins -->
<div id="header">
<div id="logo">
<!-- header text removed -->
</div>


I made the section with the logo image I need to move in bold above in the stylesheet code.

I'd appreciate and help. Thanks for your time.

Ron Jaxon

Cali
16 Dec 2008, 04:37 PM
This should help http://www.w3.org/TR/CSS2/colors.html or
{
background-image: url(yourimage.jpg);
background-position: 20px 10px;
}
adjust accordingly