-
AuthorPosts
-
August 27, 2021 at 1:58 pm #1318645
Hi,
it seems like my site alforno-esslingen.de is not mobile optimized.
Footer widgets are next to each other and not below each other.
Do I have to consider some other theme settings?
Thanks
MehmetAugust 29, 2021 at 7:29 pm #1318844Hey ms-45,
Thank you for your patience and the link to your site, I found that for some reason on this page the main content div #wrap_all is closing early so the #footer is not inside of it, so this css target won’t work:
.responsive #top #wrap_all .flex_column
which is what tells the columns to be 100% width at mobile.
I note that your pages /impressum/ & /datenschutz/ or your shopping pages do not have this problem, so it’s only your homepage.
I believe this could be a plugin conflict but you have many plugins, you could disable your plugins one at a time clearing your browser cache between each one until you find the conflict, or you could try this code in the General Styling ▸ Quick CSS field or in the WordPress ▸ Customize ▸ Additional CSS field:@media only screen and (max-width: 767px) { .responsive #top .container .av-content-small, .responsive #top #footer .flex_column, .responsive #top #footer .av-flex-cells .no_margin { margin: 0; margin-bottom: 20px; width: 100%; } }
in my test this solves and should not cause any issues in the future, after applying the css, please clear your browser cache and check.
Best regards,
MikeAugust 30, 2021 at 8:00 am #1318921Hi Mike,
Thank you so much for your great help. Your CSS code helped perfectly.
Above my footer I have two sections which do not have full widt either. For the rest it seems to be alright how it is.
If you could tell me how I get the two sections above my footer to full width with CSS I would be super happy :-)Thanks
MehmetAugust 30, 2021 at 12:47 pm #1318954Hi,
Glad that this helped, please try this css instead:@media only screen and (max-width: 767px) { .responsive #top .container .av-content-small, .responsive #top #footer .flex_column, .responsive #top #footer .av-flex-cells .no_margin, .responsive #top #liefergebiete .flex_column, .responsive #top #liefergebiete .av-flex-cells .no_margin, .responsive #top #kontakt .flex_column, .responsive #top #kontakt .av-flex-cells .no_margin, .responsive #top #speisekarte .flex_column, .responsive #top #speisekarte .av-flex-cells .no_margin { margin: 0; margin-bottom: 20px; width: 100%; } }
After applying the css, please clear your browser cache and check.
Best regards,
MikeAugust 30, 2021 at 1:24 pm #1318962This is perfect thank you so much for your great and fast support Mike!
August 30, 2021 at 2:04 pm #1318970Hi,
Glad we were able to help, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.Best regards,
Mike -
AuthorPosts
- The topic ‘Footer widgets next to each other in mobile view’ is closed to new replies.