Hi, is it possible to create some space between image (left hand side) and text (right hand side) on the product page? I want the right part of the two columns be lined up with the logo”paukersliebling”. A gap of around 50px would be great! Thanks a lot!
See: http://www.paukersliebling.de/produkt/default/
This image helps you to understand what I mean:
https://ibb.co/e9O6W5
Thanks a lot!
Hi nadinedomnink,
Here is the code you can put in Enfold > General Styling > Quick Css, if it does not work, put into themes/enfold/css/custom.css
@media only screen and (min-width: 990px) {
.template-shop div.product div.summary {
margin-left: 50px;
}
}
If you need further assistance please let us know.
Best regards,
Victoria
hi, this doesn’t work as the text disappears on the right. see image: https://ibb.co/niKN5b
thanks!
Hi,
Increase the right margin of the product container.
.single-product-main-image {
margin-right: 100px;
}
Adjust the value as needed. You might need to use a lot of css media queries to adjust the margin on different screen sizes.
Best regards,
Ismael
As it seems to me the margin between image and text changes…100px is perfect to have logo and text lined up but the text on the right is still incomplete…thanks
Hi,
What do you mean by “incomplete”? Please provide a screenshot. Also note that the width of the main container will change based on the width of the screen size so you have to adjust the right margin with css media queries. Example:
@media only screen and (max-width: 1366px) {
.single-product-main-image {
margin-right: 50px;
}
}
The css code above will adjust the right margin to 50px if the screen or monitor resolution is less than 1366px.
Best regards,
Ismael