need to customize collection in custom CSS, i did find the answer but it wont save

[Aqil]

@media only screen and (max-width: 768px) {
div[data-section-type="collection-list"] .grid-overflow-wrapper {
text-align: center;
}
div[data-section-type="Shop-by-category"]
.grid-overflow-wrapper
.grid.grid--uniform {
white-space: unset !important;
display: block !important;
}
}

-------------

its a banner "Collection List" named shop by category

i want to change it to one row of collection by 4 or 5 products and scroll horizontally to view more