Book Image

Responsive Web Design by Example : Beginner's Guide

By : Thoriq Firdaus
Book Image

Responsive Web Design by Example : Beginner's Guide

By: Thoriq Firdaus

Overview of this book

Table of Contents (16 chapters)
Responsive Web Design by Example Beginner's Guide Second Edition
Credits
About the Author
About the Reviewers
www.PacktPub.com
Preface
Index

A look into Foundation


Foundation (http://foundation.zurb.com/) is one of the most popular frontend development frameworks. It is used by a number of notable companies, such as Pixar, Washington Post, Warby Parker (https://www.warbyparker.com/), and so on. As mentioned, Foundation ships with common web components and interactive widgets. Herein, we will look into the components, as well as the widgets we are going to employ for the website.

The grid system

The grid system is an integral part of a framework. It is one thing that makes managing web layout feel like a breeze. Foundation's grid system comprises twelve columns that can adapt to narrow viewport size through the drop-in classes provided. Similar to both the frameworks we explored in the previous chapters, the grid consists of rows and columns. Every column has to be wrapped within a row for the layout to span properly.

In Foundation, apply the row class to define an element as a row, and apply the element with the columns or column...