What’s in the Box?
The CSS box model has four parts. From inside out, they are:
-
Content—Content is the text or media inside the element. (We looked at content in the previous chapter.)
-
Padding—The padding is the space around the content but inside the border. You can specify the padding separately in each of the four directions, only horizontally, only vertically, or in all directions at once. I don’t know you or your website, but odds are pretty good that a lot of your site could use more padding.
-
Border—The border is the edge around your padding. The only thing that distinguishes border from padding is that you can use a color and a pattern to draw a border around the padding and content.
-
Margin—The margin is outside the border and between ...
Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.
Read now
Unlock full access