Debut: Change alignment of category widget in mobile view

Opossumfarm
New Member
4 0 0

Hi there,

my shop uses the Debut theme. I would love the change the alignment of the category-widget items in mobile view as shown in the picture below. In desktop-view, there is enough space to display them in line. In mobile view, however, they are split into two rows with 2 items at the top and one in the bottom row. I would prefer to have the three items below each other (and a little larger, but I guess they are scaled automatically to the screen size?!), when using the mobile view.

Website: https://colorsof.life

mobileView.jpg

Any help is highly appreciated!

0 Likes

Hello,
Add this css at the bottom of
Online Store->Theme->Edit code->Assets->theme.scss.liquid

@_media only screen and (max-width: 749px){
#shopify-section-1594906741345 li.grid__item.small--one-half.medium-up--one-third {
    width: 100%;
}
}
Want to modify or incorporate custom changes on store, Hire us
If helpful then please Like and Accept Solution .
Email: pallavi@oscprofessionals.com
Skype : oscprofessionals-87
Whats app
Free Website Review and advice for sale from Shopify Conversion Experts | Shopify Private App | Custom Theme Development | Custom Modifications In To Shopify Theme | Shopify SEO ; Digital Marketing & amp | Site Speed Optimization | Performance Site Audit
0 Likes
Opossumfarm
New Member
4 0 0

Thanks for the code. Sadly it breaks the side. Maybe I did something wrong. But I placed it exactly where I was supposed to. It is not the first time, I add code to the theme. With this code, everything appears as unformated text on a blank page and the pictures are screen-sized symbols. A bis X and O etc... I have never seen something like that before.

0 Likes