24.08.2016 Views

HTML and CSS design and build websites

You also want an ePaper? Increase the reach of your titles

YUMPU automatically turns print PDFs into web optimized ePapers that Google loves.

Border, Margin<br />

& Padding<br />

Every box has three available properties that<br />

can be adjusted to control its appearance:<br />

1<br />

2<br />

3<br />

Border<br />

Every box has a border (even if<br />

it is not visible or is specified to<br />

be 0 pixels wide). The border<br />

separates the edge of one box<br />

from another.<br />

Margin<br />

Margins sit outside the edge<br />

of the border. You can set the<br />

width of a margin to create a<br />

gap between the borders of two<br />

adjacent boxes.<br />

Padding<br />

Padding is the space between<br />

the border of a box <strong>and</strong> any<br />

content contained within it.<br />

Adding padding can increase the<br />

readability of its contents.<br />

If you specify a width<br />

for a box, then the<br />

borders, margin, <strong>and</strong><br />

padding are added to<br />

its width <strong>and</strong> height.<br />

hello<br />

307 BOXES

Hooray! Your file is uploaded and ready to be published.

Saved successfully!

Ooh no, something went wrong!