How to make 1 column to 2 columns for FAQ section?

[harukajmickey]

Hello,

The section of 1 column FAQ looks like this.

But I would like to make the 2 column section as follows.

Will anyone guide me please? Thank you in advance!

URL:

https://xislxydgdxgkzd85-58947010730.shopifypreview.com/products/moment-mobile-filmmaker-cage-for-magsafe%C2%AE?_pos=2&_sid=0164dfb96&_ss=r

[AsadBaig]

Hi @harukajmickey , I have checked your site it’s doable.
Make sure to use the heading “Q&A” and your content below in a Single section. And if you’re using a custom content section then give a heading 10% or 25% width.
And content to 75% width.

[PageFly-Richard]

Hi @harukajmickey ,

This is Richard from PageFly - Landing page builder, I’d like to suggest this idea:
Step 1: Go to Online Store->Theme->Edit code
Step 2: Asset->/theme.css->paste below code at the bottom of the file:

@media screen and (min-width: 768px) {
    #shopify-section-template--16068430037162__a9deb991-2141-4c78-b3bd-76189a0d78eb {
        width: 25%;
        display: inline-block;
        vertical-align: top;
        padding-top: 60px;
    }
    #shopify-section-template--16068430037162__a9deb991-2141-4c78-b3bd-76189a0d78eb .content-indent.default .custom-block .custom-content {
        width: 100%;
        display: block;
    }
    #shopify-section-template--16068430037162__a9deb991-2141-4c78-b3bd-76189a0d78eb .content-indent.default .custom-block .custom-content .custom__item {
        width: 100%;
    }
    #shopify-section-template--16068430037162__204c2685-7a7e-4630-82c0-5ac2b2f52d83 {
        width: 75%;
        margin-left: auto;
        display: inline-block;
    }
    #shopify-section-template--16068430037162__204c2685-7a7e-4630-82c0-5ac2b2f52d83 .content-indent {
        width: 100%;
    }
}

I hope it would help you
Best regards,

Richard | PageFly

[harukajmickey]

@PageFly-Richard Thank you! It worked!