I have the desktop view (photo 1) the way I want it (medium-up--one-quarter) but the mobile view (photo 2) is only showing one column and I would like for it to show two. Not sure how to accomplish this. Thank you in advance for any guidance.
Solved! Go to the solution
This is an accepted solution.
Hi @usnpups
Follow this:
Section->feature-columns.liquid->find bellow line and add small--one-half
<div class="grid__item {{ column_width }} text-{{ section.settings.align_text }}" {{ block.shopify_attributes }}>
So it look like:
<div class="grid__item {{ column_width }} text-{{ section.settings.align_text }} small--one-half" {{ block.shopify_attributes }}>
Hi Jasoliya
How do i do this for three icons on the same line for mobile?
Thanks!
@Jasoliya wrote:Hi @usnpups
Follow this:
Section->feature-columns.liquid->find bellow line and add small--one-half
<div class="grid__item {{ column_width }} text-{{ section.settings.align_text }}" {{ block.shopify_attributes }}>So it look like:
<div class="grid__item {{ column_width }} text-{{ section.settings.align_text }} small--one-half" {{ block.shopify_attributes }}>
Add this css in asset->theme.scss file at bottom:
#shopify-section-1581344988774 .grid__item {width:33.33% !important;}
Hi,
I would like to do the same. I have three columns on my web site and when I go on mobile I have 1 image with the other one next a the bottom. I would like at least 2 columns on mobile pretty the same as collections.
When I use your code small--one-half and put it at the good place, nothing happen on my mobile.
Can you help ?
thanks
User | Count |
---|---|
394 | |
204 | |
129 | |
46 | |
42 |