Hi, so i have an image on my collage for my homepage on craft, and I’ve used the code
@media (min-width: 310px) {
.collage__item--left:nth-child(3n - 2) {
grid-column: 1 !important;
grid-row: 1 !important;
}
.collage__item--left:nth-child(3n - 1),
.collage__item--left:nth-child(3n) {
grid-column-start: unset !important;
}
}
to adjust the width, however I cannot seem to edit the height and its too large, Any help? Thank you?
Link to store and location of the issue?
https://www.vaasanai.com/
Its the collage on the main main page “wex melter” I want to get the image to be smaller in height however I’m unaware of how to do so as the image resizer doesn’t work for me
Check collage.css line 11, you should see something like
.collage__item>* {
width: 100%;//adjust this and see if it fixes your issue
}
Hi, i adjuted that and it worked perfectly for the width, however it still doesn’t change the height of the photo
In the base.css line 1131, you should see the code below, any changes you make here will reflect only on wider screens like laptops and whatnot. Lemme know if this works out.
And also the height should reduce when you reduce the width
@media screen and (min-width: 990px)
.grid--3-col-desktop .grid__item {
width: calc(33.33% - var(--grid-desktop-horizontal-spacing) * 2 / 3);
max-width: calc(33.33% - var(--grid-desktop-horizontal-spacing) * 2 / 3);// adjust here
}