Jump to content

100% width of horizontal top menu (background color)


Rock5

Recommended Posts

Hello to everybody,

 

I have just registered in the forum, though found a hundred of solutions to customization of my new shop in the forum during last few days :) 

 

But got stuck now trying to get 100% width in my top horizontal menu. I mean I want the background of the top menu (that I successfully changed) to be full width. Tried every trick, but it doesn't work  :(

I think I previously managed to change header width to 100%. http://www.cypopet.com/shop/en/

 

I did find a solution here http://www.prestashop.com/forums/topic/2602[spam-filter]solved-full-width-header-and-top-horizontal-menu/, but it seems to be not applicable to Prestashop 1.6.

 

I use default bootstrap theme.

 

Thank you very much in advance.

Link to comment
Share on other sites

  • 5 months later...

Hi Vekia,

 

I also want to make my menu bar 100% width (the top horizontal navigation bar).

 

My demo site is back.babyoutlet.ph    im using default theme 1.6.0.11

 

Can you tell me the easiest way to do this?

 

Im looking for a method that wont ruin my mobile or tablet design because right now everything is perfect :)

 

Thank you

Link to comment
Share on other sites

Hi Vekia,

 

I also want to make my menu bar 100% width (the top horizontal navigation bar).

 

My demo site is back.babyoutlet.ph    im using default theme 1.6.0.11

 

Can you tell me the easiest way to do this?

 

Im looking for a method that wont ruin my mobile or tablet design because right now everything is perfect :)

 

Thank you

 

 

in this case it will be necessary to alter container width value

.container {
max-width: 1170px;
}

change it to 100%

 

effect:

xyAKGIW.png

Link to comment
Share on other sites

:-) don't forget to share url to your shop in http://www.prestashop.com/forums/forum/136-feedback-on-my-store/ section :-)

Do I just start a new topic there and ask for comments, suggestions?

 

Why not, and I could do the change on my live shop now that I have noticed that nothing was affected in a bad way.

BUT, I changed to 98% since that was easier than figuring out how to set left margin for shit on the pages.

 

What I REALLY like with this change are the product pages, Now I might need to create larger product images since they show very nicely now and no need to enlarge anymore.  ;)

 

Still, it's to bad the Ads & Slideshow from PrestaModule doesn't respond responsive like the rest of the stuff.  Might need to ask them how to solve this. You can't set %, just px as far as I can see.  Perhaps the problem is that it's in the Top hook instead of the home hook?  But when I place it in the home hook it displays in the bottom and I have not found how to change that.

 

It does work on their reference page anyhow.  http://www.universol.fr/

 

My page link is http://webshop.bean-bag.se/sv/ and if you wonder what I meant with the size of product page you can see how big pictures get here:  http://webshop.bean-bag.se/sv/sittsackar/47-sit-on-it-change-me.html

 

Seems to me that even if the original picture is crystal sharp in same size PS does something to make quality worse (reduce file size perhaps?).

Edited by Mr.Bean_S (see edit history)
Link to comment
Share on other sites

On 1/10/2015 at 9:25 PM, vekia said:

in this case it will be necessary to alter container width value


.container {
max-width: 1170px;
}

 

 

 

Thank you Vekia, one last question regarding that. If i use that code, my text also changes to 100%.

 

Is there a way i can make the grey background bar in the top navigation 100% width but the text and drop down wont change width.

 

I literately only want the grey background to change width.

 

Is this possible?

 

Many thanks.

Edited by 71newyorker (see edit history)
Link to comment
Share on other sites

Thank you Vekia, one last question regarding that. If i use that code, my text also changes to 100%.

 

Is there a way i can make the grey background bar in the top navigation 100% width but the text and drop down wont change width.

 

I literately only want the grey background to change width.

 

Is this possible?

 

Many thanks.

But isn't the change of textsize necessary if ppl use different screen resolutions when visiting the site?

With a fixed text size the text would look huge if they have low resolution and so small they can't read it with a high resolution.

Link to comment
Share on other sites

×
×
  • Create New...