Originally posted on https://youtu.be/9207OppzJU0

Code Sample from Material-UI Grid CodeSandbox

Below is the complete course to build beautiful and consistent apps using React and Material-UI.

Check out the course trailer
Check out the course

Material UI provides a Grid system so that application is responsive or to say consistent across different screen sizes.

It supports 2 types of layouts.
Containers and
Items placed inside the container. The widths of the item are fluid and sized in accordance with the parent. Items also have padding around them.

There are 5 breakpoints supported by Material UI Grid.
xs for mobile phones
sm for tablet devices
md for medium-sized desktop screens
lg for large screens &
xl for TV screens
These breakpoints can only be applied to Grid Items and not the containers.

If you have any further questions or need help, please reach us out!