PrestaShop 1.6.x Top Menu & Sub Menu Spacing

[sounds]

Hi,

I was reading around to find out how to customize the top menu, change colors etc.

Have got the menu in the default there to look sort of how I want it, well it looks nice and clean 

What do I edit so that white space between the main menu and the drop down sub-menu is smaller?

 

Edited August 6, 2014 by sounds (see edit history)

[vekia]

hello

what menu you use? it's default one (you said) from screenshots you attached it looks like it's not default one

btw. to deal with DEFAULT TOP MENU styles alter styles in this file: themes/YOUR_THEME/css/modules/blocktopmenu/css/superfish-modified.css

[sounds]

Hi,

Yes it's the default menu, 

Thanks I went through that file and can't find that code.

Edited August 6, 2014 by sounds (see edit history)

[vekia]

line ~60

.sf-menu > li > a {
font: 600 18px/22px "Open Sans", sans-serif;
text-transform: uppercase;
color: #484848;
display: block;
padding: 17px 20px;
border-bottom: 3px solid #e9e9e9;
}

descrease padding values

[sounds]

Thanks for the reply Vekia

That decreases the padding around the top menu.

What I meant was that space between the top menu and the drop down sub-menu

When you hover over the main menu it drops down to show Smart Phones / Phablets / Tablets.

There's a big space between them.

 

Edited August 7, 2014 by sounds (see edit history)

[vekia]

in this case is necessary to inspect your website due to the fact that it's not default (clean css) menu module

[sounds]

Ok np you can see it here

It's the default menu for the bootstrap theme, just messed with the css file.

 

Thanks again

Edited August 7, 2014 by sounds (see edit history)

[Paulito]

Hello

 

As Vekia says:

 

Change the Padding to back to the Default setting of 17px and it will work

 

.sf-menu > li > a {

    font: 600 18px/22px "Open Sans", sans-serif;

    text-transform: uppercase;

    color: #C0C0C0;

    display: block;

    padding: 8px 20px;    (You have 8px not the Default 17px)

    border-bottom: 3px solid #FFFFFF; }

  .sf-menu > li.sfHover > a,

  .sf-menu > li > a:hover, .sf-menu > li.sfHoverForce > a {

    background: #333333;

    border-bottom-color: #6D94CD;

    color: white; }

 

Paul

[S-HAMMANI]

Hi

you can try this in line ~89

 

.sf-menu li ul {
    display: none;
    left: 0px;
    top: 40px;
    z-index: 99;
    box-shadow: 0px 5px 13px rgba(0, 0, 0, 0.2);
    padding: 12px 0px 18px;
}

[vekia]

top:39px; will fit ideally here :-)

[sounds]

Thanks dudes

 

I gave it top:44px small space between them

Edited June 1, 2015 by sounds (see edit history)

[vekia]

one and half moth later it is solved? ;-)
 

[sounds]

No I just didn't check this thread