Building a Liquid Design with Evened Margins and Centered CSS DIVs

Introduction

Now that you're aware of the main goal of this series of articles, it's time to review the topics that were covered in the last tutorial. As you'll recall, in that particular installment I constructed a fixed, centered web page design by using a CSS technique called "evened margins."

In simple terms, this method permits you to center a selected DIV simply by assigning the same values (in percentage, pixels, ems, etc.) to its left and right margins respectively, which causes the DIV to be positioned in the middle of a web document.

Indeed, evened margins can be considered one of easiest approaches to implement nowadays, when it comes to building centered layouts. And best of all, this technique is supported consistently by most modern browsers.

Nonetheless, as I said before, the use of evened CSS margins allows you to work indiscriminately with fixed and elastic designs, due to its intrinsic versatility. Therefore, this final article of the series will be aimed at demonstrating how to utilize this approach for building a liquid web page design, thus completing this introductory guide to using a few popular DIV-centering methods.

With the preliminaries out of our way, it's time to tackle the last chapter of this educational journey. Let's go!