The mobile version of the site broke.

http://prntscr.com/fbnav3
In the settings, mobile optimization is enabled.

Hi

Please tell me the url to the exact page with an example of this issue.

https://goo.gl/b6xhDc
Joomla version: 3.7.2

Hi

You have a bunch of overrides to the width of the columns, so mobile layout work. Easiest to keep it and still have the mobile layout running is to move this override to the end of the /css/template.css file.

If I remove the customization of the code, will the mobile version return to the normal view?

Hi

There is no need to remove it, just move the changes to /css/template.css file so they will not affect mobile.css and tablet.css files when smaller screen is used on the site.

I completely replaced my folder with the css to yours, but the site did not become the same as in the demo version. Maybe it's because of the update of the Joomla?

Hi

What do You mean by "completely replaced my folder" ? Please send me an access to ftp and joomla panel to my email [email protected] so I'll just correct it myself.

Hi

Just got to Your mail, but I'm afraid Your FTP access is not working. Please check it and send it one more time.

Hi

As I've just discovered it wasn't easy to look for Your changes in styles, so I took a different approach and overriden Your changes for some screen layouts. I've added this code to template's override section:

Code: Select all

@media only screen and (max-width:1100px) {
#gkContent, #gkPageContent, #gkSidebarLeft {
    float: none;
    min-height: 0 !important;
    width: 100% !important;
}

#gkSidebarRight .box {
    float: none;
    width: 100%;
}
}

@media only screen and (max-width:850px) {
#gkSidebarRight {
    float: none !important;
    width: 100% !important;
}

#gkContentWrap > div {
    width: 100% !important;
    min-height: 0 !important;
}
}

@media only screen and (max-width:640px) {
#gkBannerLeft, #gkBannerRight {
    float: none !important;
    max-width: 100% !important;
    width: 100% !important;
}
}


I changed only the indents between the "objects" on the main page.
This is how the demo version looks and what my site looks like.
http://imgur.com/a/mQ6Bh
http://imgur.com/a/KHvB0
Maybe it's because I updated Jumla?

Hi

Seriously no idea why it broke for You. But I've just added some extra classes, so I think it should be ok from now.

Last request, could you help, remove this indent in the mobile version?
http://prntscr.com/fv6wk4

I ask you to close the topic, thank you.

Hi

I can see You've dealt with the margin from Your last post, so I can close this thread now.