css-responsive-layout

Question 1

What is a breakpoint in responsive Web design?

Answer 1

A breakpoint is a specific width at which the layout of a webpage changes to better fit the screen on which it is being viewed.

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

One advantage is that it allows the column to scale automatically with the size of the screen.
Another advantage of using a percentage width is that it makes it easier to create a flexible and responsive layout that adjusts to different screen sizes. When you use fixed widths in pixels, you have to manually set different widths for different screen sizes

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 of source order - cascading