Google News
logo
CSS Box Model
The CSS box model is essentially a box that wraps around every HTML element. It consists of: margins, borders, padding, and the actual content.
Box Model
Example :
<html>
<head>
<title>CSS Box Model</title>
<style>
.main_box{
border:2px solid #859224;
}
.box_model{
background:#F2F2F2;
color:#000;
width:auto;
border: 15px solid #859224;
padding: 30px;
margin: 30px;
}
</style>
</head>
<body>
<div class="main_box">
<div class="box_model">
Lorem Ipsum is simply dummy text of the printing and typesetting industry. 
Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, 
when an unknown printer took a galley of type and scrambled it to make a type specimen book.
</div>
</div>
 
</body>
</html>
Output :
Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book.