O'Reilly logo

Web Design Blueprints by Benjamin LaGrone

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Terra firma

Finally, we will be adding elements to the ground. These will mostly be buildings and trees, and they will be easy to add because they are also Font Awesome SVGs.

In the terra SECTION element, inside the ground DIV element, there are two DIV elements: give the first class left and green, and then give the second DIV element the right class. Then, in the left green DIV element, add a handful of trees from Font Awesome, and in the right DIV element, add a truck and some buildings from Font Awesome. Give the buildings the additional classes small and large. The terra SECTION element code looks like this now:

 <section id="terra"> <div id="ground"> <div class="left green"> <i class="fa fa-tree"></i> <i class="fa fa-tree"></i> <i class="fa ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required