edit-article

Article Description: CSS-GUIDE-flexbox - a comprehensive guide to CSS flexbox layout. This complete guide explains everything about flexbox, focusing on all the different possible properties for the parent element (the flex container) and the child elements ...

Chapter ID/Name:

Status: Write Writing Written

Add Photo:

Owner ID:

Content: use HTML Edit Content <h1 style="text-align: center;">GUIDE - flexbox</h1> <h2>[WHAT]</h2> <ol> <li>[] comprehensive guide to CSS flexbox layout. This complete guide explains everything about flexbox, focusing on all the different possible properties for the parent element (the flex container) and the child elements (the flex items). It also includes history, demos, patterns, and a browser support chart.</li> </ol> <h2>[WHY]</h2> <ol> <li>[]&nbsp;The main idea behind the flex layout is to give the container the ability to alter its items' width/height (and order) to best fill the available space..."</li> </ol> <h2>[WHERE]</h2> <ol> <li>[] <a href="http://css-tricks.com/snippets/css/a-guide-to-flexbox/" target="_blank">http://css-tricks.com/snippets/css/a-guide-to-flexbox/</a></li> </ol> <h2>[WHEN]</h2> <ol> <li>[] designing web page/site layouts</li> </ol> <h2>[EXAMPLE]</h2> <ol> <li>[] <a href="https://codepen.io/anon/pen/vZegMK?editors=1100" target="_blank">https://codepen.io/anon/pen/vZegMK?editors=1100</a> - Codepen by captain anonymous that demonstrates the use of many of the flexbox layout features<a href="https://codepen.io/anon/pen/vZegMK?editors=1100" target="_blank"><br /></a></li> </ol> <h2>[HOW-TO]</h2> <ol> <li>[]</li> </ol> <h2>[REFERENCE]</h2> <ol> <li>] css flexbox essentials ] by devtips - https://www.youtube.com/watch?v=G7EIAgfkhmg - w/codepen</li> </ol> <h1 style="text-align: center;">&nbsp;</h1>