You need to split your logo image in two and attach one part to #logoWrapper as you have it, and one part to #logo. (The gradient repeated is another way that can work, but requires another step and some added HTML code.)
First, in Photoshop or whatever graphics program you have, take the left & middle part of the image up to but not including the grass on the right, and stretch the plain shaded blue background by another 300 or 400 pixels to the right. Save it as headerbgl.jpg. Take the right part of the image with the grass and save that as headerbgr.jpg.
Now edit your stylesheet. Find this
Code:
#logoWrapper{
background-image: url(../images/headerbg.jpg);
background-repeat: no-repeat;
background-color: #D6E0DD;
height:110px;
margin: 0em;
padding: 0em;
}
and change it to this
Code:
#logoWrapper{
background-image: url(../images/headerbgl.jpg);
background-repeat: no-repeat;
background-position: top left;
background-color: #D6E0DD;
height:110px;
margin: 0em;
padding: 0em;
}
#logo{
background-image: url(../images/headerbgr.jpg);
background-repeat: no-repeat;
background-position: top right;
/*width:100%; uncomment this if necessary*/
height:110px;
margin: 0em;
padding: 0em;
}
Bookmarks