General

block-level layout / block level layout definition

In CSS, a block-level box in CSS creates an “element box” - a rectangular box.  The box designates the degree of space surrounding an element.  The content, padding and border areas of an element make up the background area.  Any transparency of the border (such as if it was dashed) will be seen through those sections.  The margin area is not included in the background portion of an element.  Important to note is that just the width, height and margins of an element box can be set to auto.  Margins may contain negative values.  The default of an element box for its border and padding widths are none and 0 (zero).  Also, the property width determines just the width of the content area if the box-sizing is content-box.  The property width determines the full width of the content, borders and padding if the box-sizing is border-box.  If there are margins, they are placed in addition to it.  This same principle applies to the height in regards to the height of the element.