<commit_before># IN PROGRESS
# Flexbox exercises

A set of layout exercises which are expected to be solved using flexbox. 
These exercises are aimed at those who have just learnt flexbox to test their understanding of the core concepts and the different layout approaches. 

The main aim of this is for devs to get some hands on practice on different flexbox concepts

## Points to Note
These exercises are for testing out your knowledge of flex concepts, as such they have been kept very simple
* Exercises only use CSS and HTML
* The solutions are expected to be very simple and don't have any fallback/support for older browsers.

## Exercises
* [Centering](https://github.com/sk1981/flexbox-exercises/tree/master/centering)
* [Sticky Footer](https://github.com/sk1981/flexbox-exercises/tree/master/sticky-footer)
* [Navigation Bar](https://github.com/sk1981/flexbox-exercises/tree/master/navigation-bar)
* [Flexible Width Grid](https://github.com/sk1981/flexbox-exercises/tree/master/stretching-grid)

# Resources
* [Leveling up with FlexBox](http://www.zomigi.com/blog/leveling-up-with-flexbox)
* [Using CSS flexible boxes](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes) by MDN
* [Flexbox Reference](http://tympanus.net/codrops/css_reference/flexbox/) on Codrops
* [Mixing old and new for Best Browser Support](https://css-tricks.com/using-flexbox/) on CSS Tricks
* [Solved by Flexbox](http://philipwalton.github.io/solved-by-flexbox/) demos by <NAME>   <commit_msg>Improved text<commit_after># Flexbox exercises

A set of layout exercises which are expected to be solved using flexbox. 
These exercises are aimed at devs who have learnt flexbox and now want to test their understanding or get some hands-on experience of the core concepts and the different layout approaches. 

## Points to Note
These exercises are for testing out knowledge of flex concepts, as such they have been kept very simple
* Exercises only use CSS and HTML. CSS is for basic styling and applying flexbox properties and HTML for the page structure.
* The solutions are expected to be very simple and don't have any fallback/support for non-compliant browsers (See resources for more inforamtion on this).

## Exercises
* [Centering](https://github.com/sk1981/flexbox-exercises/tree/master/centering)
* [Sticky Footer](https://github.com/sk1981/flexbox-exercises/tree/master/sticky-footer)
* [Navigation Bar](https://github.com/sk1981/flexbox-exercises/tree/master/navigation-bar)
* [Flexible Width Grid](https://github.com/sk1981/flexbox-exercises/tree/master/stretching-grid)

# Resources
* [Leveling up with FlexBox](http://www.zomigi.com/blog/leveling-up-with-flexbox)
* [Using CSS flexible boxes](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes) by MDN
* [Flexbox Reference](http://tympanus.net/codrops/css_reference/flexbox/) on Codrops
* [Mixing old and new for Best Browser Support](https://css-tricks.com/using-flexbox/) on CSS Tricks
* [Solved by Flexbox](http://philipwalton.github.io/solved-by-flexbox/) demos by <NAME>   
{'fraction_non_alphanumeric': 0.1010262989095574, 'fraction_numerical': 0.010262989095574085, 'mean_word_length': 4.998076923076923, 'pattern_counts': {'":': 0, '<': 5, '<?xml version=': 0, '>': 5, 'https://': 12, 'lorem ipsum': 0, 'www.': 2, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '3643607', 'n_tokens_mistral': 985, 'n_tokens_neox': 925, 'n_words': 299}