In this recipe, you will learn how to build a layout using the flexbox library.
The flexbox grid library can be found at http://flexboxgrid.com/. The Less files for this library are not yet available at the time of writing this book, but you can download the Less code to build the grid from https://github.com/bassjobsen/flexboxgrid. You can see how the layout is built in this recipe in your browser, and the Less code can be compiled in your browser too, leveraging the client-side less.js
compiler.
You need to perform the following steps:
Download the flexbox grid library from https://github.com/bassjobsen/flexboxgrid and unzip this file into your working directory.
Create an
index.html
file and write the following HTML code into it:<!DOCTYPE html> <html> <head> <title>Gradients with Less Elements</title> <meta name="viewport" content="width=device-width, initial-scale=1.0"> ...