CSS Media Queries

Question 1

What is a breakpoint in responsive Web design?

Answer 1

the point where the site’s content will adapt to the user’s screen, giving the best user experience possible.

Question 2

What is the advantage of using a percentage (e.g. 50%) width instead of a fixed (e.g. px) width for a “column” class in a responsive layout?

Answer 2

fixed values such as PX will not adapt to different sized screens, messing up the user experience

Question 3

If you introduce CSS rules for a smaller min-width after the styles for a larger min-width in your style sheet, the CSS rules for the smaller min-width will “win”. Why is that?

Answer 3

because the browser will hit the smaller numerical width first as it expands.

Question 4

Give two examples of media features that you can query in an @media rule.

Answer 4

min/max width, min/max height, and many more including orientation, etc.

Question 5

Which HTML meta tag is used in mobile-responsive web pages?

Answer 5

meta tag