Narrative Theme Product Page Layout Fix

[TomL32]

Hi,

I have an issue regarding the product page of the Narrative theme.
I don´t like the default layout of the product page of this theme, I want to have the product information etc. on the right side next to the product picture.

So I edited the code in "theme.scss.liquid"-file like this:

@media only screen and (min-width: 768px) {
.product-template__media {
float: left !important;
width: 50% !important;
}

.product__content {
float: right !important;
width: 50% !important;
}
}

As you can see in the pictures below it worked well for some screens, but when I open the product page in the preview view, the pictures below are overlapping with the main product picture and also the product picture and the product description drift apart (but not for all products, even if the pictures are in the same format).

I would be very grateful if someone could help me 🙂
Thanks in advance!