Intro to CSS Flexbox - Flex Wrap

A flex container flexes its items with no overflow effects. The flex items within the parent flex container will always try to fit all items on one line by default.

Flex wrap allows you to change that behavior by allowing the flex items to wrap as needed with this property. You can additionally control which direction they wrap which makes this property quite powerful!

I tend to use flex-wrap almost always with responsive layouts as on small screens flex items will need to often collapse to their own width of the viewport.

Read the full blog post: https://web-crunch.com/posts/intro-to-css-flexbox-flex-wrap

View the entire collection: https://web-crunch.com/collections/css-flexbox

=====

Hi, My name is Andy Leverenz and I work as a product designer and developer. For fun, I design, code, and write. Check out my blog called Web-Crunch https://web-crunch.com where I publish design and development tutorials with the occasional vlog.

♥️ Sponsor me on GitHub https://github.com/sponsors/justalever

☕️ Keep me awake. Buy me a coffee https://www.buymeacoffee.com/webcrunch

📰 One-Click Subscribe: https://www.youtube.com/user/webcrunchblog?sub_confirmation=1

💻 Previously published at: https://web-crunch.com/posts/intro-to-css-flexbox-flex-wrap

👋 Latest Course: HELLO HTML & CSS (coming soon)👋 https://hellohtmlcss.com

💎Ruby on Rails Course: HELLO RAILS https://hellorails.io

💻 Check out the blog: https://web-crunch.com

🦄 Check out my personal site: https://justalever.com

🚀 Links: Weekly Newsletter: https://digest.web-crunch.com/ Twitter: https://twitter.com/webcrunchblog Github: https://github.com/justalever

📘Check out my book on UX Design: "LUXD: Learn User Experience Design" https://web-crunch.com/products/luxd

📙 Check out my FREE book on Tumblr Theming: "Pro Tumblr Theming" https://web-crunch.com/products/ptt ... https://www.youtube.com/watch?v=NUObEKLhEiY