• 0
Sign in to follow this  
Followers 0

Moving Navigation on top of background image in header area

Question

Posted · Report post

I would like to create a header background image with the navigation sitting on top similar to http://www.amalafoundation.org/. When I have attempted this with both brandnav and regular branding and navigation set ups in the header section of the template area I can not figure out how to move the navigation on top of the image.

Share this post


Link to post
Share on other sites

6 answers to this question

  • 0

Posted · Report post

@margeaux7: Can you please post a link to your site?

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

I just started this but I wanted to know I could actually create what I envisioned. http://maggpietest.com/

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

First, I'd suggest you get http://www.getfirebug.com (Firebug for Firefox) an add-on that will give you the ability to test CSS live to see if it works. Second, I'd suggest using it on the site you want to emulate so you can see how it's done. Then, find the same type element (some changed from Platform Pro to PageLines Framework) and apply the changes. Third, I'd also suggest the Action Map plugin (via the Store) one of our Free plugins to help you see where things need to be applied. From there, it should simply be a matter of CSS which you can apply in the style.css found in PageLines-Customize plugin or in Custom Code.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

I agree with @rangelone. What you want is possible. But there is some work involved.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

I have tried and tried for the past 3 months to get the hang of firebug and also google chrome. I have failed.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

@margeaux7, when it comes to CSS and coding, I'm a total dunce. With Firebug, I was able to learn so much that I now help others with often complex solutions. On the right panel where the CSS is shown, you can edit CSS of various site elements. If it works on screen, just highlight the CSS you edited (the whole snippet) and right click (on a PC/Windows machine) and copy. Go to Dashboard > PageLines > Settings > Custom Code > CSS Rules and paste it at the end, then save. It's that simple. If you need help figuring out what CSS is, and how to use it, do what I do - cheat - go to http://www.w3schools.com/css/ and learn from the thousands of examples there. Also, I'd suggest reading that site to gain a great understanding of stylesheet elements. You can also engage one of our Pros at http://www.pagelines.com/pros

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!


Register a new account

Sign in

Already have an account? Sign in here.


Sign In Now
Sign in to follow this  
Followers 0