CSS Grid Layout

Asked

Viewed 131 times

1

I’ve been a while without messing with front-end but now I’m taking a look at CSS Grid Layout. After reading the articles, I was left with a question: Is there any number of standard columns to start or maximum for the layout? I read a group commenting on using 12 columns, that’s right?

1 answer

0

This is perhaps more a design issue than a front-end issue, but thinking about how one affects the other and the user experience (UX) and the purpose of the application you can vary quite between column numbers, and also vary how the content is distributed by them. Always thinking about the resposivity.

See how Grid can vary according to device screen size.

inserir a descrição da imagem aqui

"That’s up to you and your project. The reason for working with 12 columns, which is the most used format, is because of the flexibility provided and for being able to divide the layout evenly. That is, you can divide 12 by 2,3,4 and have a series of modulations available (2 x 6 , 3 x 4) and also in several other combinations. If you divide 12 columns by 2, you will notice that you can have 6 sets of 2 columns without that on any column.

But the number of columns can vary from project to project. Basically, the greater the number of columns (14 or 21, for example) the greater the number of possibilities to divide the layout. Generally this type of Grid is used when you have a lot of editorial content and the design is designed with a width of 1140px or more."

Here’s an excellent article in Portuguese with more details: https://brasil.uxdesign.cc/um-guia-completo-sobre-grids-para-design-responsivo-6b192fea0124

Browser other questions tagged

You are not signed in. Login or sign up in order to post.