Search code examples
cssresponsivegrid-layout

Using column-count for responsive grid system


I would like to know if it's a good idea to use just column-count for making a simple grid system, instead of using flex, grid, or float.

It would look something like this:

.2col { column-count: 2}
.3col { column-count: 3}
.4col { column-count: 4}

 @media (max-width: 767px) {
    .2col { column-count: 1}
    .3col { column-count: 1}
    .4col { column-count: 1}
}

Is anybody using this?


Solution

  • I would not use it. It is not flexible enough (yet) for common scenarios.

    I once had the same idea, started to use it, but very quickly reached the point where I could not fix some alignments .