Padding = The distance we want to give from element to the boarder

boarder = On a given dimention how thick the border should be with specified colors

=> boarder can be done in analog mode like top, right, bottom, left

margin = After border How much space is need to be left all around

Ex:

index.html

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<title>CSS Box Model</title>

<style>

/* Write your CSS code here */

div {

height: 200px;

width: 200px;

}

p {

margin: 0;

}

#first {

color: blue;

background-color: cadetblue;

padding: 20px;

border: 10px solid black;

}

#second {

background-color: gold;

border:solid black;

border-width: 20px 10px;

margin-left: 260px;

}

#third {

background-color:indianred;

border: 10px solid black;

margin-left:40px

;

}

</style>

</head>

<body>

<div id="first">

<p>

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam at sapien porttitor urna elementum lacinia. In

id magna pulvinar, ultricies lorem id, vehicula elit. Aliquam eu luctus nisl, vitae pellentesque magna. Phasellus

dolor metus, laoreet ac convallis sit amet, efficitur sed dolor.

</p>

</div>

<div id="second">

<p></p>

</div>

<div id="third"></div>

</body>

</html>