trying to make my main product photo larger. Tried adding following code but mobile display wasn't good:
<div class="grid-item large--two-fifths" style="width 60%";>
<div class="grid-item large--three-fifths" style="width 40%";>
While this did make the image larger, it is a solution to a different problem. I would like to simply make the product image taller and more prominent.
Here is our website with an example product: https://www.raoofmdderm.com/products/retinol-10x-serum-1oz?_pos=1&_sid=4b0dc5ae6&_ss=r
Here's a reference website for what I'm trying to achieve: https://www.drmtlgy.com/collections/anti-aging/products/retinol-complex-5?gclid=CjwKCAjw9aiIBhA1EiwA...
Thanks in advance for the help!
Remove the Semi colon and add colon like below.
<div class="grid-item large--two-fifths" style="width: 60%"> <div class="grid-item large--three-fifths" style="width:40%">
Hope it helps.
Zeian, thank you for getting back to me with an answer. 2 problems happen when i insert that line:
1) The images still isn't displayed in the same size as the reference website
2) On mobile, everything is jumbled. The pictures with background are overlapping the text, the text is extremely narrow, and the buttons look bad.
Any other thoughts?