Joomla Templates Club 406,261 posts

[angie00 Friend angie00Join date: November 2011Posts: 294Downloads:0Uploads:80 Thanked: 10 times in 1 posts]

#178086

I am needing some help changing the color on the header. We would like to either expand the background image to be underneath the menu or change the lighter blue to be the same color as the background of the menu. Here is what we have thus far:

#ja-header { background: url(../images/pagebg.jpg) no-repeat #003a62 !important; }

#ja-header .main {
padding: 8px 0 15px 0;
}

#ja-mainnav {
background: url(../images/mainnav-bg.gif) repeat-x left bottom #003a62
padding-bottom: 6px;
}

Thanks in advance for your help!

---

Attachments:

1. 

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#457221

Hi there,

Could you post URL of site you’re working on? and please set Compress CSS in template manager to No. I shall try to help you.

[ramonesmania Friend ramonesmaniaJoin date: May 2012Posts: 17Downloads:0Uploads:7 Thanks: 4 Thanked: 2 times in 1 posts]

#457282

In my project I have split the image in 2 images.

The first part of the image is in #header

#ja-header { background-image: url(../images/background.jpg); background-position: center; no-repeat top left fixed;}

and the second in #ja-mainnav

#ja-mainnav { background-image: url(../images/background2.jpg); background-position: center; no-repeat top left fixed;}

[Saguaros Moderator SaguarosJoin date: September 2014Posts: 31405Downloads:237Uploads:471 Thanks: 845 Thanked: 5346 times in 4964 posts]

#457369

Please update your site URL, I shall help you out with the provided information.

[angie00 Friend angie00Join date: November 2011Posts: 294Downloads:0Uploads:80 Thanked: 10 times in 1 posts]

#457928

ramonesmania- can you show me an example of what you mean?

Saguaros- site is on a localhost at this time

[ramonesmania Friend ramonesmaniaJoin date: May 2012Posts: 17Downloads:0Uploads:7 Thanks: 4 Thanked: 2 times in 1 posts]

#458022

We have the two containers #ja-header and #ja-mainnav in which we are going to add the 2 split images.

In my project i have expand the #ja-header in height.

So i have the images

background.jpg which is going to be placed in #ja-header

and background2.jpg which is going to be placed in #ja-mainnav

Then i have add the following codes for #ja-header and ja-mainnav

#ja-header { background-image: url(../images/background.jpg); background-position: center; no-repeat top left fixed;}

#ja-mainnav { background-image: url(../images/background2.jpg); background-position: center; no-repeat top left fixed;}

the result is

---

Attachments:

1. 
2. 
3. 
4. 

[Author]

Posts