The need for Flexbox’s creation goes back to the popularity of the web in the early 1990s. During this time, there were few best practices for Web design, leaving Web pages chaotic and disorganized. Amidst this disorder, <table> was introduced. Designers could create grids out of their Web pages, mimicking print media such as newspapers and brochures (Dilger 213). Although <table> was a huge improvement, it was just the beginning to controlling Web layouts. Improving visual elements of grids is equally as important as improving delivery of content. Many pro-international style designers believed grids "'are used to help bring order to a page and to impose structured thinking into the design process'" and "'this engagement with the wider world is a political act'" (Dilger 221). At this time, there was little talk of creating flexible grid layouts. Dilger brings in Timothy Samara’s ideas of "making and breaking the grid" in which Samara discusses deconstructing grids to make them more effective. <table> did not have the capabilities mentioned by Samara to break out of the "straitjacket" of uncreative grids (Dilger 223). Dilger ends his discussion of grids by suggestion the future of Web standards should "better support a more flexible approach to the grid, developing best practices that offer strong alternative to <table> and its descendants" (Dilger 225). Finally, we see the need for a flexible grid layout module. Cue: Flexbox.
Flexbox is a grid-based layout module that’s goal is to provide an efficient way to arrange elements on a page. With Flebox items are directed, aligned, ordered, and flexible. Flexbox items are designed to best fill the space of their container. Flexbox’s capabilities allow it to fix layouts, usually deemed difficult or problematic when done in CSS. Some of the problems solved with Flexbox are: simpler grid systems, a hack-free Holy Grail Layout, full-width, fluid input add-ons, media objects with fixed or varying figure sizes, sticky footer, and vertical centering.