In this recipe, we will look into using Flexbox utility classes to easily align nav-tabs. Doing this is a simple task. However, to extend the recipe and make it more useful, we have also included a lot of content in each of the nav-tabs. Thus, in this recipe, besides demonstrating how to align nav-tabs, we will look into splitting a complex layout into several partials, dealing with different heights on tabs, and using a few simple CSS declarations to modify the look of our nav-tab items.
To preview the completed recipe, navigate to chapter8/complete/app through your console. Run the harp server command. Open your browser and visit localhost:9000/recipe08-07. Click on different tabs and try resizing the viewport. Look at the way that tab content responds to changes in viewport size.
