CSS CSS Layout Basics Controlling Layout with CSS Display Modes Using Inline-Block to Set Width, Height, Top and Bottom Margin and Padding

Caroline Louw
Caroline Louw
10,478 Points

when your designing the layout of webpage do you start styling everything for a mobile screen first ?

Or add the media query for that afterward?

2 Answers

Bert Witzel
seal-mask
.a{fill-rule:evenodd;}techdegree
Bert Witzel
Front End Web Development Techdegree Student 8,810 Points

It's good practice (or so I've been told) to add a max-width at some point so your content doesn't get stretched too far in wide screens. You can do this in CSS rather than as a media query by adding a max-width to your container-div's, like max-width: 1150px. You can also have a media query where you have a min-width and a max-width if you want to be specific about a certain sized screen.

Bert Witzel
seal-mask
.a{fill-rule:evenodd;}techdegree
Bert Witzel
Front End Web Development Techdegree Student 8,810 Points

When you want to design with a mobile-first approach or responsive design then yes, you want to do your base styles for a mobile device and then add media queries to fit all kinds of screens, using min-width for various breakpoints.

Caroline Louw
Caroline Louw
10,478 Points

So, when will you add the max-width?