[Solved]make top menu drop down to the left

[cobi]

hello, i got problem, i make my top menu fullwidth by add padding, but the drop down menu drop to the outer screen, i want to make it drop down to the left instead of drop down to the right

i install prestashop in localhost, not yet online

i have been searching in this forum for my solution, but i did not get the solution

really give headache

prestashop version 1.5.6.0

 

i attach the picture and superfish-modified.css from my topmenu

 

 

 

superfish-modified.css

Edited April 22, 2014 by cobi (see edit history)

[PascalVG]

cobi,

do you have sub-submenu's (i.e. in your popupmenu can you go to a submenu?), or only one submenu (i.e. only one menu down from the topbar)?

 

If only one submenu:

 

In your file on line 43:

.sf-menu li:hover ul,

.sf-menu li.sfHover ul {

    left: 0;                    // remove this line

    right: -8px;                // add this line

    top: 34px; /* match top ul list item height */

    z-index: 99;

    width:auto

}

 

 

Hope this helps,

pascal

[vekia]

i tried it on my own.

I'm right-handed, and I felt very strangely using this kind of menu

[PascalVG]

Vekia:  :-)

[cobi]

If only one submenu:

 

In your file on line 43:

.sf-menu li:hover ul,

.sf-menu li.sfHover ul {

    left: 0;                    // remove this line

    right: -8px;                // add this line

    top: 34px; /* match top ul list item height */

    z-index: 99;

    width:auto

}

 

 

Hope this helps,

pascal

 

hi pacsal thank you, i do exactly what you suggest, but can i make submenu block more left? and the text have center position in the block?

and i have plan add sub-submenu in "artikel" -> "tentang emas" -> "emas kuning", can i make sub-submenu "emas kuning" drop to the left?

 

Edited April 13, 2014 by cobi (see edit history)

[cobi]

i tried it on my own.

I'm right-handed, and I felt very strangely using this kind of menu

hi vekia im right handed too, but i don't know how to make top menu fullwidth, then i try add more padding

 

do you have another way to make topmenu fullwidth?

[PascalVG]

To move the drop down menu more to the left, you can just change the -8px to some other value, like -4px, 0px, 2px etc. Play with it what suits you:

 

    right: -4px;                // change -8 on the added line above to like -4px

 

in the same block as above, add this line to make the text centered:

 

1. text-align: center;

 

 

so together something like:

 

.sf-menu li:hover ul,

.sf-menu li.sfHover ul {

    right: -4px;                // change to -4px or so

    top: 34px; /* match top ul list item height */

    z-index: 99;

    width:auto;      <- don't forget ; as we add one more line....

    text-align: center;

}

 

Changing direction of the sub-sub menu is much more work, I'm afraid. May even need some core code change. When I've time, I might have a look, but pretty busy lately...

 

pascal

[cobi]

 

To move the drop down menu more to the left, you can just change the -8px to some other value, like -4px, 0px, 2px etc. Play with it what suits you:

 

    right: -4px;                // change -8 on the added line above to like -4px

 

in the same block as above, add this line to make the text centered:

 

1. text-align: center;

 

 

so together something like:

 

.sf-menu li:hover ul,

.sf-menu li.sfHover ul {

    right: -4px;                // change to -4px or so

    top: 34px; /* match top ul list item height */

    z-index: 99;

    width:auto;      <- don't forget ; as we add one more line....

    text-align: center;

}

 

Changing direction of the sub-sub menu is much more work, I'm afraid. May even need some core code change. When I've time, I might have a look, but pretty busy lately...

 

pascal

 

Thank you pascal   

my submenu now more left

 

i'm now work for correct the position of sub-sub menu

but i looking for help also

i hope you not too busy

Edited April 14, 2014 by cobi (see edit history)

[cobi]

pascal i managed to make sub sub menu pop up to left, and arrow pint to the left, this solved

[cobi]

i don't know how to mark this as solved, how to edit the title?

[PascalVG]

Hi Cobi,

Glad you made it work. Maybe you can tell shortly which files you edited, so others can use it as well :-)

 

See my footer for how to mark topic solved ,

pascal

[cobi]

hi, sorry for late repply

i edited ..\modules\blocktopmenu\css\superfish-modified.css

 

if you want modify sub sub menu drop position to the left look for this

 

ul.sf-menu li li:hover ul,

ul.sf-menu li li.sfHover ul {

/*left: 200px; /* match ul width */           <- this was commented

right: 0px                                              <- this was added, you can replace the 0 number with any number

top: 0px;                                               <- this was added, you can replace the 0 number with any number

Edited April 22, 2014 by cobi (see edit history)

[PascalVG]

Thanks!