Box styling
There are many ways to spice up a block of text such as borders in many different styles. With styling a box padding and margins need to be properly contained and it can be tedious to select the right style, color, and width of a border to correctly match. Creating drop shadows or single underlines can emphasize a particular point that the designer is trying to get across to the web viewers.
Collapsing margins
Vertical margins are more flexible and are able to collapse whereas horizontal margins cannot. Vertical margins do not add together when there are top (50) and bottom (30) margins, they overlap and would equal 50. This is because middle elements, in a stacking order do not need both margins, the margins would no longer be equal.
Box models
Padding, margins, borders, width, and height all affect the size and shape of a box/text element. By adding a border in the CSS, the HTML of the box will be affected, there is a fine balance between the two code languages; the coder must learn to have both work together. Sometimes the key can be setting the width of the box to start with, otherwise it can continue to expand as elements are added to it; boundaries always need to be added to properly contain boxes and other elements.