Vertical Alignment on Mobile Version of Impulse Theme

Store Design
1

Hi guys,

So I have this Custom Content on my main Home Page that is look like this:

Screen Shot 2021-08-09 at 16.22.30.png
Screen Shot 2021-08-09 at 16.22.30.png1044×278 32 KB

Anyone can help me to code vertical alignment for the mobile Version please?

My link is: http://anna-michielan.myshopify.com

Thank you.

2

Hello @anna-michielan

Please share this preview link of section

3

Hi @Kinjaldavra

It’s on this link: anna-michielan.myshopify.com

4

Hi @Kinjaldavra

It’s on my main page of the website, between Best Seller and Testimonial Section.

anna-michielan.myshopify.com

Screen Shot 2021-08-09 at 21.11.55.png
Screen Shot 2021-08-09 at 21.11.55.png766×704 134 KB

Thank you in advance :slightly_smiling_face:

5

hello @anna-michielan

please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file.

@media only screen and (max-width: 759px){
#shopify-section-1628516569c5e6962c .grid {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
       overflow: hidden;
    }
    #shopify-section-1628516569c5e6962c .grid  .grid__item {
        flex: 0 0 100%;
        justify-content: center;
        align-items: center;
    }
    #shopify-section-1628516569c5e6962c .grid  .grid__item >div {
        width: 200px !important;
        margin: 0 auto;
    }
    #shopify-section-1628516569c5e6962c .grid  .grid__item  >h3 {
        text-align: center;
        font-size: 21px;
    }
     #shopify-section-1628516569c5e6962c .grid  .grid__item .rte-setting.text-spacing.enlarge-{
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        font-size: 20px;
    }
}