O'Reilly logo

Web Programming with HTML5, CSS, and JavaScript by Dean

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

3.21 Element Box, padding Property, margin Property

In the previous section, you learned how to display a border around an element. Usually, borders have no gaps inside or outside of them. Sometimes that’s appropriate, but usually you’ll want to introduce gaps to make the elements look comfortable, not cramped. To introduce gaps around an element’s border, you need to take advantage of the element’s element box. Every web page element has an element box associated with it. As you can see in FIGURE 3.19, an element box has a border, padding inside the border, and a margin outside the border. For most elements, but not all, the default border, padding, and margin widths are zero. You can adjust the widths with the border-width, padding, and ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required