Web Design with HTML and CSS

(National Geographic (Little) Kids) #1

170


A brief history of layout techniques on the web

Web Design with HTML and CSS Digital Classroom

8 Change the height of the footer div to 118 pixels (highlighted in red):
height: 118 px;

Save the fi le and preview it in your browser. Your footer is now positioned correctly.

The fi nal appearance of the footer.

You have fi nished this lesson, and you have a good foundation to build your page. In the next
lesson, you will continue working on this design, add more images, upgrade the style of your
navigation bar, and add other elements to your page.

In this lesson, you learned the diff erence between table and CSS layouts. You also learned to
use the fl oat and clear properties to create columns on your page. Finally, you explored the
advantages and disadvantages of using margins and padding to control your layout.

To compare your work with a complete version of the fi nal page, open the fi le named
“07_fi nal.html” in your web07lessons folder.
Free download pdf