Header alignment problem

Hi all,

This is my website on the 1.3.8 version using freetemplate1: https://www.weezones.com/zencart

I'd like to have the "home - login" (on the left) aligned with the languages and currencies (on the right), right after the topmenubar and before the headerpic.

Couldn't figure out after hours of research.. I guess it's a matter of correctly editing the tpl_header but don't know how :)

Thanks in advance for your help!

Panuma

Find #navMain in the stylesheet and add the red part:

#navMain {
padding-right: 7px;
padding-top: 5px;
float:left;
}

Then find #navCurrenciesWrapper and move it by changing the number of px - should be around top:63px; and **right:440px;, **but you'll have to fiddle with it to get it the way you want.

#navCurrenciesWrapper {
color: #bbb;
position: absolute;
top: 8px;
right: 10px;
}

Thanks Steevesh!

adding float:left worked well. I put the same code for the NavCurrencies with float:right instead. It kind of workds but how come NavMain "follows" the headerpic and NavCurrencies does not?
(I don't want NavMain to follow, I want it to stay up, right after the topmenubar).

And last thing do you see the topmenubar separations, where can I adjust their heights?

Many many thanks

Don't float navCurrencies - just change the red parts to move it left and down. It's positioned absolutely, so changing the top:8px to top:63px; and the right:10px; to right:440px;. What you're doing is placing that section 63px down and 440px left from the upper right corner.

You may have to remove the top:100px; from #headerpix.

Ok now the NavCurrencies is well placed, but if I don't give headerpic top:50px, the image hides NavCurrencies. On the other hand NavMain comes on top of headerpic, but I'd like to have it before headerpic...

Sorry for the trouble

Anyone an idea?

Hi all,

Anybody knows how to fix the following header alignment problem?

I just want to have the home - login and the languages & currencies aligned after the topmenubar and before the headerpic.

I don't know why now the navMain comes on top of headerpic and not before...

Thanks a lot for your help!

According to your source (and Web Developer) #navMain is inside the headeerpic div, so you won't be able to move them relative to each other.

I would try to fix that, using the Developers Tool Kit to see where the code is. You might want to get rid of #headerpic altogether and just use the regular Zencart header background image placement.

thanks for the insight, I moved NavMain away from headerpic div and played around with the stylesheet to get what I wanted.
I'm happy with it.

thank you