CSS padding property
Padding is the space that surrounds content inside the border. The padding property defines the padding for the selected element. For example, the following code adds 50 pixels to each side of the <div> container:
div {
padding: 50px;
}
In the example above, the padding is highlighted in purple. But in reality, the background color of the content area expands to fill the padding. It works like that because the padding is inside the border, and everything inside the border gets a background.
Pro Tip: You can use any unit for the padding of an element, not just pixels. Em units are particularly useful for making your margins scale with the base font size.
