We’re with you. JoomShaper is offering a 20% Discount on all plans due to the impact of COVID-19.

Support Offline : Mon - Fri / 10am - 6pm (GMT +6)

Your Time: Our Time:

Image that fills a block in SP Builder 3

Featured Lock Resolved Issue
Hi,
Thanks in advance to your answer.
https://le-doyenne.hotel-archange.com

In the second banner, called Photos, I put images addons with lightbox, and I would like that whatever the size of my image, it fills the block.
I created a class .photos-lightbox and put this code:
.photos-lightbox {
width: 260px! important;
height: 260px! important;
object-fit: cover;
}
But of course that does not work, because object-fit: cover; only applies to img.
I would like the images from my class .photos-lightbox to apply the object-fit: cover; and just on the pictures of my class
Best regards

5 Answers

Archange Consulting

More than a month ago #Permalink
Yes Of course ! I've solved too with that :

@media (max-width: 767px) {
img{
width: 435px !important;
height: 244px !important;
object-fit: cover;
}}
@media (min-width:768px) and (max-width:991px) {
img{
width: 720px !important;
height: 405px !important;
object-fit: cover;
}}
@media (min-width: 992px) {
img{
width: 260px !important;
height: 260px !important;
object-fit: cover;
}}

Thanks a lot !

Sifat - Staff

More than a month ago #Permalink
Hi,
Thanks for your query. Actually by default it's doing the same. But you can also put your style like this:

.photos-lightbox img.sppb-img-responsive {
object-fit: contain !important;

Here i used contain to check if that css is working or not.


-Best Regards

Sifat - Staff

More than a month ago #Permalink
Great

Archange Consulting

More than a month ago #Permalink
Thanks !


There are no replies made for this post yet.
Be one of the first to reply to this post!

124

Templates

331334

Community Users

Newsletter

Don’t miss any updates of our new templates and extensions and all the astonishing offers we bring for you.
We never spam

Joomla! ® name is used under a limited license from Open Source Matters in the United States and other countries. JoomShaper.com is not affiliated with or endorsed by Open Source Matters or the Joomla! Project.

Connect Us