The CSS min-width property sets the smallest permitted width for an element’s box. In a responsive Flexbox layout, it prevents portfolio cards from becoming too narrow while the browser window changes size. section 11.2.5
Use min-width with responsive layout techniques:
- Set each portfolio card’s minimum width to 250px and its maximum width to 300px. section 11.2.5
- Enable Flexbox content to wrap so cards adapt to the browser’s available width. section 11.2.5
- Do not confuse the property with min-width in a media query, which tests whether the screen is at least a specified width. section 12.2.9
Responsive portfolio cards
Ask for a Flexbox portfolio container whose cards wrap, with a minimum width of 250px and a maximum width of 300px. The cards can then adapt from large monitors to smartphone screens without becoming too small. section 11.2.5
Make the portfolio container a Flexbox container. Enable the content to wrap and give each card a minimum width of 250px and a maximum width of 300px.
Use this copyable instruction to request minimum and maximum card widths together with Flexbox wrapping. section 11.2.5
