muhammad369 / ResponsiveGrid_Flutter

Responsive Grid Layout for Flutter
MIT License
88 stars 27 forks source link

Question: please what do lg, xs and md means in Responsive Grid #1

Closed Wizpna closed 5 years ago

Wizpna commented 5 years ago

Hi awesome developer,

Please can you help me out, I need to understand what lg, xs, and md means in Responsive Grid so that when I'm using such properties, I will know where it fits in.

Thanks for your awesome feedback.

muhammad369 commented 5 years ago

the library is meant to be used the same way as Bootstrap web framework for each size category you provide the ratio it should fill from the width assuming its total width is 12 and it applies for larger size category unless overridden xs: extra small sm: small md: medium lg: large xl: extra large

the threshold widths that determines the current size category is the same as Bootstrap's

xs: width < 576 sm: width < 768 md: width < 992 lg: width < 1200 xl: width >= 1200

ex: say you want to make two containers to stack on small width, but starts to place side by side starting from large width, set: xs: 12 and lg: 6 or just lg: 6 only, because it's always 12 by default

hope this explanation helps :)

more info on bootstrap grid system: https://getbootstrap.com/docs/3.3/css/#grid

Wizpna commented 5 years ago

thanks so much for the feedback.