Horje
horizontal scroll with css grid Code Example
horizontal scroll with css grid
add display grid to parent element and for the child, use this:

display: grid;
grid-gap: 16px;
padding: 16px;
grid-template-columns: repeat(auto-fill,minmax(160px,1fr));
grid-auto-flow: column;
grid-auto-columns: minmax(160px,1fr);
overflow-x: auto;

grid-auto-flow: column; will force the grid to add your elements as column instead of following the free space.

grid-auto-columns: minmax(160px,1fr); the items added outside the viewport do not match auto-fit, so they won't get the size defined in your template. So you have to define it again with grid-auto-columns.

overflow-x: auto; auto will add the scrollbar




Css

Related
QAnon Won't believe who Code Example QAnon Won't believe who Code Example
css code for increasing size Code Example css code for increasing size Code Example
how to add tailwind css in yarn Code Example how to add tailwind css in yarn Code Example
ul class= social-icons Code Example ul class= social-icons Code Example
css geight Code Example css geight Code Example

Type:
Code Example
Category:
Coding
Sub Category:
Code Example
Uploaded by:
Admin
Views:
11