PROBLEM "MAIN MENU" MOBILE...

Hi. I have several problems with the "Main Menu" in the mobile devices with the "Quark" template ...
1) Sub-button menu "SHOP" in the "Main Menu" appears already fully extended, unlike how it works on a PC ... Any Idea?

2) Button "CERCA QUI", the "Main Menu" non funziona, not open, does nothing ... Any solution for this case?

Thanks greetings...

Hi

In the matter of fact it works as it was designed. All submenus should be visible at start.

The only problem is that overlay menu is removing modules form it, since there is no telling if they will fit correctly. Luckily in Your case they do, so You can add this code to override.css to force them to show:

Code: Select all

#gk-menu-overlay-wrap .module {
    display: block !important;
    padding: 20px 0 !important;
}


Hi. It works, but is not that why leave me all flags in the menu language now ?, even languages that do not have configured ... Besides, now the site Logo overlaps with the Menu ... I send photos later , thanks greetings...

Hi. As agreed, we send attached images in a way that you can see some of the most serious problems of "Quark" template on mobile devices ... Use green fleschas to point out the problems ... They are not the only ones, but if the most serious, at least so far. Any solution? ... greetings, thank you ...

mobile_1.jpg

mobile_2.jpg

mobile_3.jpg

*Continued to send pictures in the next message, because the system does not allow more than three attachments, thanks, greetings ...

Hello, I send the remaining images, thanks, greetings ...

mobile_4.jpg

mobile_5.jpg

Hi

Ok. But ALL of this issues comes from changes done to the template or an entered content.

Ok. Lets try to adjust some of them again:

Code: Select all

#gk-mobile-menu-text {
display: none !important;
}

@media only screen and (max-width:900px) {
.gkStoreInfoAdditional {
    display: none;
}
}

#gk-menu-overlay-wrap a.flag {
    float: left;
    margin: 0 15px;
}

@media only screen and (max-width:1150px) {
.big-photo .big-photo-desc h2 {
    line-height: 22px;
}
}

#gkBottom1 .big-photo-desc {
    padding-left: 20px !important;
    padding-right: 20px !important;
}


All codes added and looks to take an effect.

Tell me the dimentions of a screen the mobile_3 image was taken.

Hi, thanks for your response and professionalism. The present resolution image 3 is the resolution of the Samsung Galaxy S2, positioned horizontally rotated on the screen, the precise value in real px I do not know ... I think 800 × 480 pixels. In the case of the image 5, the flags should not leave the mobile menu, as it was before. Greetings thank you.
* I just did a test with the indicated code, the problem of image 4 resolved. In the case of the image 1 has improved, but there are still problems of alignment, positions, etc. Sorry about the delay in responding, I had some personal problems ...