Product Page: Floating two sections next to each other?

[thecastlerose]

Hello! I’m work on my first shopify store and need a bit of guidance with some coding stuff. I just installed the Product Reviews app and placed it on the Product Page template underneath the Product Info section; to make better use of the space, I wanted to have the review section and a collapsible content section with an FAQ next to each other, but I’m not sure where I need to be to code this or what would be the best / responsive way to do it.

I started by attempting to float each of these sections left / right with width at 50%, but since they’re different section types, they’ve got weird mismatched spacing. They also stop conforming to the site’s content width and go full screen. I guess I’d want to place both of these within a section so they’d keep the site’s content width but I don’t know where on the backend I need to be in to do this or if this is even the right method.

Is there any way to accomplish this or am I biting off more than I can chew lol. I have some html / css knowledge, but this is my first time with Shopify.

for reference: I’m using Shopify’s Taste theme and here’s a link to my current product page.

[Be_Steven]

Hi @thecastlerose

It will need a bit time to give you a perfect solution. I only have time to give you a suggestion.

Since you can code so hope this helps.

Note: The red arrow will let you see the CSS need to be added. You should wrap all of them in a media min-width so it will not affect to mobile & tablet screen

[thecastlerose]

Thank you, @Be_Steven ! I’ll give it a try and let you know how it turns out.

question though: what would be the best method to make sure that the margins on the outer edges match the margins of the rest of the content - the edge of the product photo, above, for example.