Hello my page collection page currently looks like this but I want to make it more like in this order on phone and on desktop. I just want them to show next to each other inline like on the picture below. Does anyone know how to do that? My current code is this: My website URL is Collecties – TrendBlend. Thanks in advance!
.card__heading {
text-align: center;
color: #0000ec;
font-weight: bolder;
font-family: "Lucida Console", "Courier New", monospace;
font-size: 16px;
}
.card__inner,
.card__media {
position: relative;
border-radius: 50%;
display: block;
width: 170px;
height: 170px;
background: #e6e7ed;
-moz-border-radius: 30px;
-webkit-border-radius: 90px;
}
Hi @TrendBlend
Try this at the bottom of the base.css file :
.collection-list__item.grid__item.scroll-trigger.animate--slide-in {
flex: 15%!important;
}
Hi @Xipirons that works, thank you! Do you also know how I can get the light brown border line around the picture?
Kind regards,Stef
And one more question do you maybe know how to do it like this, so the pictures around not being placed on top of each other?
Hi @TrendBlend
For the border around the picture :
.card__media {
border: 5px solid #AF9676;
}
Hi @TrendBlend
I don’t understand your question… Could you reformulate ?
Hello @Xipirons , I want the collections to be scrollable next to each other like this if possible on phone and desktop
it currently shows like this: Collecties – TrendBlend
