CSS Padding

0 3729

The padding property in CSS defines the portion of the box model, creating space around an element's content.

CSS stands for Cascading Style Sheet.

padding_all, padding_top, padding_left, padding_right and more.

<!DOCTYPE html>
<html lang="en">
<head>

<style type="text/css">
.padding_all { padding:25px;}
.padding_top { padding-top:15px;}
.padding_top { padding-bottom:15px;}
.padding_left { padding-left:15px;}
.padding_right { padding-right:15px;}
.padding {padding:15px 10px 15px 10px;}
</style>

</head>
<body>

<p class="padding_all">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc sagittis, justo eu maximus tempor, ante ex scelerisque sem, vel auctor velit justo et nisl. Donec laoreet condimentum lorem nec facilisis.</p>

<p class="padding_top">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc sagittis, justo eu maximus tempor, ante ex scelerisque sem, vel auctor velit justo et nisl. Donec laoreet condimentum lorem nec facilisis.</p>

<p class="padding_top">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc sagittis, justo eu maximus tempor, ante ex scelerisque sem, vel auctor velit justo et nisl. Donec laoreet condimentum lorem nec facilisis.</p>

<p class="padding_left">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc sagittis, justo eu maximus tempor, ante ex scelerisque sem, vel auctor velit justo et nisl. Donec laoreet condimentum lorem nec facilisis.</p>

<p class="padding_right">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc sagittis, justo eu maximus tempor, ante ex scelerisque sem, vel auctor velit justo et nisl. Donec laoreet condimentum lorem nec facilisis.</p>

<p class="padding">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc sagittis, justo eu maximus tempor, ante ex scelerisque sem, vel auctor velit justo et nisl. Donec laoreet condimentum lorem nec facilisis.</p>

</body>
</html>