I have this css class the first one is to make my grid responsive, but @1000px I want it to scroll and don't wrap so that's why I make repeat 3, now the problem that some times I have 3 items, some times less

If I have less then 3 (2,1) I have a huge white space to scroll

So is there any way to have dynamic number with scroll and avoid having empty white space to scroll?

CodePudding user response：

Your question is a bit vague, but I'll give it a shot. According to what you said I assume you have a set height. Try instead of using height: Xpx; setting a maximum height. So when you have less than 3 elements to show, your scroll div will only size to the visible elements.

Like this -> max-height: 300px;

Or

Use @media to set fixed sizes depending on the viewport size.

@media (min-width: 761px) and (max-width:1079px) {
    .your_style {
      * your css*
    }
}

CodePudding user response：

Firstly you need to give the stylesheet with a particular name. The style is needed to the style for the code written. After that you need to give the link of that page to the code page.(with using the anchor that and href you can can the style sheet to the coding page)