Positioning a Row Background Image
-
Hi,
Is there a way to position an image that is set as a Row Background Image? I’d like to align the image to the bottom of the row and center it.
Here’s a quick example/test page: https://dev.rickangenent.nl/projecten/project-2/
Thanks in advance!
-
yes!
right click the row in the gridder.
click "set row html class and id"
and as class enter:bgbottom
then use this css:
@media (orientation: landscape) { .bgbottom .background-image.background-image-count-1 img{ object-fit: fill!important; width: 100%!important; height: auto!important; left: 0!important; top: auto !important; bottom: 0!important; } }
Enter this css in "lay options" -> "custom css & html" -> "custom css"
not in "custom css for desktop"
(needs to be in custom css, because we use a media query here, and for desktop already has a media query applied to it)we're using a media query for landscape browser, because if were on a portrait sized browser we dont want to use this css
because then a white gap could appear
1/2
Before you post:
- When using a WordPress Cache plugin, disable it or clear your cache.
- Update Lay Theme and all Lay Theme Addons
- Disable all Plugins
- Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code", click "Save Changes"
This often solves issues you might run into
When you post:
- Post a link to where the problem is
- Does the problem happen on Chrome, Firefox, Safari or iPhone or Android?
- If the problem is difficult to explain, post screenshots / link to a video to explain it