[Support request] Image placement issue

[Richard]

Hi,

I’m using WP site Nouveau with Elementor builder, which, I think, has some custom code for the images, so that the edges go behind the text boxes for style reasons, both on mobile and desktop.

If you look at the generic (mostly horizontal) book image on the home page, you’ll see it.

https://gutsandvictory.com

I’d like to replace that image with an actual book cover (vertical), here:

https://gutsandvictory.com/wp-content/uploads/2020/11/cora.book_.cover_.jpg

Unfortunately, that causes issues because the book image gets cropped or goes behind the text box and obscures part of the cover. For example:

https://gutsandvictory.com/wp-content/uploads/2020/11/Image-2.jpg

Anyway, I think this is something I can’t fix, or can’t fix well, with Elementor (perhaps I can?) but am wondering where/how to tweak the custom code, and where to find it, to fix this problem.

Any suggestions would be most welcome.

Thanks.

Richard

[Elvin]

Hi,

To clarify: You want to display the book cover in full without being overlapped by the textarea?

To do that, edit the page and Elementor.

Go to the section with the issue. You should see 2 columns.

To make the image display without cropping:

Select the left column. Under its “Style tab > Background” set the size to Contain. It should display the whole image.

To prevent them from overlapping:

You simply have to remove the margin left and right set on the 2 columns so they don’t overlap.

[Author]

Posts