Site URL: https://www.dmistry.co.uk/
Hi @tuanphan,
On my homepage I've got a grid of images for which I've applied some custom css (which you wrote) to remove the padding and make it full width, it appears how I want it to on a desktop and tablet.. but on mobile, there's white space at the top and bottom of each image block.. is there a way to remove this please?
I've got the code below, applied to my homepage.
/* homepage grid */
section[data-section-id="60e9829ec4c1a734c5d9c0cb"] {
.content-wrapper {
padding-left: 0px!important;
padding-right: 0px!important;
max-width: 100%!important; }
.image-block img {
transition: all 0.5s ease;
}
/* set background */
.image-block figcaption.image-card-wrapper {
background: rgba(255,255,255,.95);
transition: all .3s ease !important;
max-height: 100%;
opacity: 0;
}
.image-block figcaption.image-card-wrapper * {
text-align: center;
color: #3CBBC2 !important;
}
/* show on hover */
.image-block:hover figcaption.image-card-wrapper {
opacity: 1;
visibility: visible;
}
.sqs-block.image-block {
padding: 0!important;
}
}
Hoping you can help please! Thanks in advance!