/*
•Start with fluid CSS before adding responsive CSS
•This is key for making the content fit in as many screen sizes as possible
•Make content fit RELATIVE to its container from the start instead of setting a specific size
•Don't rely only on defined device sizes
•Use percentage-based widths for major page components is important in making your pages flexible
•Combine with min- and max- widths to add constraints to the layout while maintaining flexibility
•You can use last 2 items together: %s and min/max widths
examples
use:
max-width: 400px;
width: 60%;
to prevent container from getting larger than 400px but also restricting the size to 60% when window is small.
Fluid vs Responsive
•fluid layouts are relative to the size of the viewport, and may look like it changes as the display gets bigger or smaller, but it doesn't actually change, the width just gets wider or smaller.
•responsive layouts actually do change based on specific screen sizes