Image Overlay Add-on - Question | JoomShaper
Black Friday sale is live with flat 50% OFF. Sale ends soon! Grab your deal now!
Back to the questions

Image Overlay Add-on

CR

clements radenborg

SP Page Builder 4 years ago

Hi, I'm using the Image overlay add-on for the header of my website. (Joomla 4.0.3, SP Page Builder 3.7.15)

What I want is a textblock on the right and a picture on the left. This looks allright on a laptop screen, but on smaller viewports the picture is cut-off on the right side. I would like it to be cut off on the left, since that part of the picture is just black.

The website is https://clements.nl. It is still under construction, but with user demo and password demo, you can have a look what I mean.

Is there a way to adjust this? I've set the row to be fluid, to use the whole screen.

Thnx,

Clements

0
1 Answers
Order by
Oldest Newest Votes
Rashida Rahman
Rashida Rahman
Accepted Answer
Support Agent 4 years ago #36629

Hello,

It would be better to have a look into the site though.

Actually, the image is working as a background image, and it will not be visible in fullwidth with all device resolutions as per my knowledge.

But there is some property values may help to get the view better. So you can try this code in your custom CSS:

.overlay-background-image {
    background-repeat: no-repeat!important;
    background-position: 50% 50%!important;
    background-size: cover!important;
    background-attachment: inherit!important;
        }

Note: Path towards custom CSS: Extensions>Templates>Styles> Click on your current default template name then choose Template Options. Then find custom CSS within the custom code.

Best Regards

0