If you want to run the code along with me, you can see my code for each chapter on Codio at https://codio.com/kevinhorek/Learning-Zurb-Foundation or on Github at https://github.com/kevinhorek/Learning-Zurb-Foundation. First off, let's change the page titles in the index.html
file on or around lines 7 and 16 to Learning Zurb Foundation
. Next, let's delete lines 22 to 40, 46 to 150, and then delete lines 50 to 67. Then, refresh your browser and you should see just the Learning Zurb Foundation title.
So, we can see the grid at work. Let's add a border around our columns; we will remove this later. On line 9, let's add <link rel="stylesheet" href="css/foundation-book.css" />
, and then in our CSS
folder, let's add a foundation-book.css
file. In this CSS file, let's add the following code:
.columns { border: 1px solid black; }
Next, perform the following:
On line 28, let's change
<div class="large-8 medium-8 columns">
to<div class...