We’ve looked a lot at how to style with CSS. Let’s switch gears now and look at how to lay out and position elements.
Padding
The padding is the spacing between an element’s content and its border. By default, most elements have zero padding. An element’s padding is not inherited by its children.
Padding can be specified with any size unit or with a percentage. When padding is specified as a percentage, the value used is the given percentage of the containing block’s width. Listing 7-1 has a simple example of this.
<style>
.container {
border: 1px solid red;
width: 200px;
}
.inner {
padding: 25%; ...
