How do I separate the logo and menu?

I would like the menu to be shown below the logo instead of side-by-side.

How do I do that?

Hi

Using only css, try this:

Code: Select all

h1.logo,div.logo-text {position: absolute;top:-20px;}
#gk-nav {width: 100%;}

Cheers

Thanks for this, it worked, now how can i move the menu to the left and make it 100% from the left to the right, i mean to match the width of the container?

Thanks

please show me the site..

Here

Thanks for the support

I'm new here so sorry for any confusion..... trying to make this work in Joomla 1.6 and I've been looking through the CSS files but I can't find the same values in them as are listed in here..... anyone get this to work?

Thanks!

Zach

Looks like I posted too soon! I figured out how to do what I needed.... here is what I did:

In template.css I changed line 61 to be the following:

Code: Select all

#gkLogo { height: 40px; margin: 0; line-height: 100%; position: absolute; top: 3px;}


Then, in layout.css I modified line 14:

Code: Select all

#gkMenuNav {float: left; margin:25px 0 10px 0; width: 100%}


To make it full width I went to line 52 of my template.css file and changed the following:

Code: Select all

#gkMenu { float: left; width: 100%; height: 40px; background-color: #6C6459 }


Hope this helps someone else too


Zach

Hi zbeatty

Lots of thanks for your idea...

It worked very well... Excluding only with IE7

I checked my web site with IETester, which can be downloaded
at http://www.my-debugbar.com/wiki/IETester/HomePage,
and it showed me the logo will be totaly shifted right ( even
more to the right than the search position ) with IE 7 .
As you can see from attached file

Browsers-behavoir.jpg

or you can view the site I'm working on at:
www.webdesignportugal.net/temphost3

I suggest you check your web site with IETester because it
many be happening the same to your logo with IE7 .

And...
For the Gavick forum support team: Can you help us
with a solution for this problem, please?

Lots of thanks in advance,

Miguel Garcia

Hi

IEtester is not a realible tool for me. I still was encountering problems which it didn't predicted or actualy not having problems it was pointing at.

The solution Saihincha suggested is working just fine. Additionally just as precousion I would add:

Code: Select all

#gkWrap1 {
position: relative;
}


to CSS just to make sure IE will handle it.

Hello again...

The way I found to solve the logo at right side in IE7 was in fact

the solution presented in this topic by member zbeatty but adding

to #gkLogo the code

left: 10px; ( or what anyone need it to be from left )


#gkLogo { height: 103px; margin: 0; line-height: 100%; position: absolute; top: 35px; left: 10px;}


This definitely solved the problem of the horizontal logo totally miss aligned to the right in IE 7.

Thanks to all

Miguel Garcia

Hi

So please try what Saichinha suggested. It's less invasive, so IE should stay clear.