rachelandrew / cssgrid-ama

Ask me anything about CSS Grid Layout
328 stars 12 forks source link

force single row with grid-auto-flow: column and auto-fit? #147

Open Brixy opened 6 years ago

Brixy commented 6 years ago

Dear Rachel,

I am trying to style a single row grid parent with overflow-x—just like the the developer area on the GitHub homepage.

This does not work

.developers {
    display: grid;
    grid-gap: 30px;
    grid-template-columns: repeat(auto-fit, 200px); /* this line can be dropped */
    grid-auto-flow: column;
    overflow-x: auto;

}

unless you add

.developers > * {
    min-width: 200px;
}

Is this the intended behaviour?

I also tried grid-template-columns: repeat(auto-fit, minmax(200px, auto)) etc.

Thank you very much! I really appreciate all your effort concerning the brilliant grid technique.