Problem with Pixellove Template Main Menu background

Hi,
I am working on this template and I have found a problem with the background of the Main Menu on top:

http://demo.gavick.com/joomla25/pixellove/

if you open the link with Firefox 15.0.1, and then open the Bookmarks side window in Firefox, the background behind the main menus starts to shrink.

You can see an image of this effect here:

http://www.use.com/showoriginal.pl?set= ... affd18&p=1

The shrinking seems directly correlated in size with the size of the Firefox bookmarks windows on the side.

The same problem happens also if we close the Bookmarks window and then resize the WIDTH of the Firefox window. It happens also on Internet Explorer and Google Chrome (I have not checked Safari).

So basically it seems to be some sort of cross-browser fixed-width problem.

I am wondering if there is anything we can do to resolve this issue.

My hope would be to see the Main Menu background going all the way to the right end of the page.

Any suggestion welcome. Thank you.

Hi

Please try adding:

Code: Select all

#gkMenuNav {position: absolute; right:0}


on template.css file.

Cheers

Hi

Please try adding:

Code: Select all

#gkMenuNav {position: absolute; right:0}


on template.css file.

Cheers

Hi, thanks for the help, can you please clarify where to add the code?

For example: shall I open the template.css file in
/public_html/templates/gk_pixellove/css

and then where exactly (row number?) do I have to add the suggested line of code?

It's better this way:
Go to template parameters > advanced settings and enable the use of css override.
Them open ../css/override.css file and add that code there.

Cheers

It's better this way:
Go to template parameters > advanced settings and enable the use of css override.
Them open ../css/override.css file and add that code there.

Cheers

Thanks - after implementing the suggested fix we have a new issue that can be seen here:

http://www.use.com/showoriginal.pl?set= ... 9ebe0f&p=1

Basically the Main Menu scrolls all the way to left when resizing the browser window and ends up covering the text of the logo in the top left corner.

I'm afraid there's no other way.
This happens because of the complex position of gkNav div and parent div's.

Try using this line instead on override.css file and see if fits better:

Code: Select all

#gkNavWrap {position: absolute; right: 0}


Also please remember that pixellove template doesn't have responsive framework.
I assume that's the main reason why you are pointing this out.

Cheers

Try using this line instead on override.css file and see if fits better:

Code: Select all

#gkNavWrap {position: absolute; right: 0}


Thank you, this could be a good solution that works for us.
Cheers.