The biggest challenge for me as a beginning designer was in using borders and padding. For some reason unknown to me, different browsers would show these things differently! This was, of course, before I knew anything of the box model. Some browsers display the box model using the W3C standards which means the width of a box only counts the content. Some browsers display it using the "traditional" method in which the width includes not only the content, but any margins, borders and/or padding as well.

Below is an example of the two types of box model. The example is 300px wide with a 5px border. I've colored the container behind it blue for better visibility. CSS
.box{ text-align:center; width:300px; background:yellow; border:5px solid orange; }

HTML
<div class="box"> This is a box. </div>

Result with Standards compliant Box Model:

The 5px border is "outside" of the 300px box, making the total size 310px wide.

300px wide box + 5px left border + 5px right border = 310px wide

Result with traditional Box Model:

With the traditional box model, the 5px border is "inside" of the 300px box, therefore the size doesn't change.

The box model not only applies to borders, but the same concept applies with padding as well. CSS
.box{ text-align:center; width:300px; background:yellow; border:5px solid orange; padding:10px; }

HTML
<div class="box"> This is a box. </div>

Result with standards compliant Box Model

With the standards compliant border box model, the 10px padding and the border are "outside" of the 300px box, making the total size 330px wide.

300px wide box + 10px padding left + 10px padding right + 5px left border + 5px right border = 330px wide

Result with traditional Box Model:

With the traditional border box model, the 10px padding and 5px border are "inside" of the 300px box, therefore the size doesn't change.

There is more than one solution to this issue (among them is Tantek's box model hack), but my personal method is to use an outer and inner container for the content. By applying the padding to the inner container, the width of your content will not be affected.
CSS
.box{ text-align:center; width:300px; background:yellow; }
.box-inner{ padding:10px; border:5px solid orange; }

HTML
<div class="box"> <div class="box-inner"> This is a box. </div> </div>

Result with Standards compliant box model

Result with traditional box model