DEV Community

Discussion on: The Key Element to Responsive Websites

Collapse
 
trailblazer1902 profile image
Adegboyega Blessing Olamide

I am coming conversant with the flexbox. Would try the grid too

Collapse
 
cmuralisree profile image
Chittoji Murali Sree Krishna

Yeah flexbox Is good, it's older than grid, but also the most searched stuff in caniuse.com,

Bur grid is newest entry to the web and it has a lot to offer than flexbox, but also bit complicated than flexbox,

flexbox needs to be combined with queries to make it responsive,
But grid mostly doesn't need queries because of inbuilt layouts and other attributes.

These were upto my knowledge, I might be wrong

Thread Thread
 
trailblazer1902 profile image
Adegboyega Blessing Olamide

I would love you to share how to write grid without queries please.

Thread Thread
 
cmuralisree profile image
Chittoji Murali Sree Krishna • Edited

As I said Previously grid cannot entierly used without media queries, but in few cases we can stop using queries,

Ex: grid-template-columns: using this we can make a page like {youtube, ecommerce, or few blogs} responsive without using queries, this will make the elements inside it to be take the given ammount and renders it on the screen based on screen size,

link : codepen.io/murali-sree-krishna/pen...

you can alter the number of divs or components displayed on the screen by increasing the size in "grid-template-columns: repeat(auto-fit, minmax(size, 1fr));"

These were upto my knowledge, I might be wrong

Thread Thread
 
trailblazer1902 profile image
Adegboyega Blessing Olamide

Very helpful buddy... Thanks