CSS Padding Text (HTML and CSS Example)

With CSS padding you can set the inner margins of a block, i.e. the distance between the edges of the container and the elements inside. It can be applied to all blocks (divs, spans, tables, paragraphs, etc). Use either padding: value for the same padding across all edges or padding-top, padding-bottom, padding-left or padding-right to associate values with each edge.

HTML Example:

This paragraph has no padding. The text is right against the border

This text has a padding of 15 pixels on all edges

CSS Example:

#withoutPadding {padding: 0px; border: 2px solid red}
#withPadding {padding: 15px; border: 2px solid lime} 

Result:

This paragraph has no padding. The text is right against the border

This text has a padding of 15 pixels on all edges

Share

Learn how to design amazing websites