common problems in nested div elements

The following are some kinds of problems encountered when nesting divs:

absolute position a div while respecting the padding of its container

solution: use a wrapper div as shown in this playground project.

different border thickness in div elements that are horizontally align using display: inline-block

Use vertical-align: top

This is exemplified in this SO question of mine and also in this playground project.