- This topic has 13 replies, 2 voices, and was last updated 7 years, 9 months ago by
.
-
Posts
-
Hello there,
I need help on footer widgets. Was able to create 2 columns for tablet view but can’t seem to get it right for mobile view for the footer.
I want the same view for mobile as the tablet. 2 Columns.
can’t see this on website cause it’s in staging mode.
Customer Support
Hi there,
you can try this, but i think you will find that 2 columns on mobile may be a little too cramped:
@media (max-width:768px) { .inside-footer-widgets>div { float: left; width: 50%; clear: none; } }Great,
However, i would like widget 1 & 2 to be the same row, then 3 & 4 to start a 2nd row. how do i make this?
Lets try using Flex instead:
@media (max-width:768px) { .inside-footer-widgets { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; } .inside-footer-widgets>div { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50%; } .inside-footer-widgets>div:first-of-type { -webkit-box-flex: 1; -ms-flex: 1 0 100%; flex: 1 0 100%; } } @media (min-width:768px) { .inside-footer-widgets>div:first-of-type { display: none; } .inside-footer-widgets>div.grid-20 { width: 25%; } }great! it worked perfectly.
Now i would like to add 1 global widget for mobile but this 1st widget should be only in 1 column while the rest are in 2 column as per normal.
Is this possible? What’s the best way to do it?
I updated the code above to cover that. Increase footer widgets to five and put the mobile only widget in the first widget area.
It works on mobile now, thanks.
Sorry forgot to mention, I would like desktop view to remain looking with only 4 widgets.
At the moment it is looking with 5 widgets except with the 5th footer widget empty.
Edited the code above to adjust the widget 🙂
amazing! got what I wanted with crazy fast support! thanks a bunch!
Awesome. glad i could help
Hi Again,
Sorry I realised that the 5th widget is not showing on homepage but it is okay on the rest. Any way to fix this?
Can you check the Layout meta box in the page editor:
yep that fixed it. thanks again!
You’re welcome
- You must be logged in to reply to this topic.
