Shopify themes, liquid, logos, and UX
Hi all,
For my desktop version I moved the description to the right of each image. (see below)
However this doesn't work well for the mobile version:
How would I move the description under each image for the mobile version, but keep the desktop version the way it is???
website: ordinarythings.club
Thank you so much for the help :))))
Solved! Go to the solution
This is an accepted solution.
@Vlavlip Try this..
{% style %}
@media only screen and (max-width: 425px){
.collection .card.card--standard.card--media{
display: block;
}
.collection .card.card--standard.card--media .card__inner {
width: 50%;
margin: auto;
}
.collection .card.card--standard.card--media .card__content {
width: 100%;
padding-left: 10px;
margin: auto;
}
}
{% endstyle %}
If I managed to help you then, don't forget to Like it and Mark it as Solutions.
Hi @Vlavlip
Follow these Steps:
Go to Online Store Edit Code Find theme.liquid file or base.css
Add the following code in the bottom of the file above </body> tag
@media only screen and (max-width: 425px){
.collection .card.card--standard.card--media{
display: block;
}
.collection .card.card--standard.card--media .card__inner {
width: 50%;
margin: auto;
}
.collection .card.card--standard.card--media .card__content {
width: 100%;
padding-left: 10px;
margin: auto;
}
}
If I managed to help you then, don't forget to Like it and Mark it as Solutions.
@Vlavlip can you share screenshort in which file you paste code?
This is an accepted solution.
@Vlavlip Try this..
{% style %}
@media only screen and (max-width: 425px){
.collection .card.card--standard.card--media{
display: block;
}
.collection .card.card--standard.card--media .card__inner {
width: 50%;
margin: auto;
}
.collection .card.card--standard.card--media .card__content {
width: 100%;
padding-left: 10px;
margin: auto;
}
}
{% endstyle %}
If I managed to help you then, don't forget to Like it and Mark it as Solutions.
2m ago Learn the essential skills to navigate the Shopify admin with confidence. T...
By Shopify Feb 12, 2025Learn how to expand your operations internationally with Shopify Academy’s learning path...
By Shopify Feb 4, 2025Hey Community, happy February! Looking back to January, we kicked off the year with 8....
By JasonH Feb 3, 2025