CSS Box Model

The Css Box model defines about layout and design which consist margin, border, padding and actual content. you would be able to see a box in which a part of 512x128. This is the actual data. 

The padding exist between border and actual data.

The margin exist out of the border.  


<style>
.container{
            background: red;
            margin: 14px;
            padding: 13px;
            border: 4px solid black;
}
</style>

Comments

Post a Comment

Popular posts from this blog

command

 composer require php:^8.0 dompdf/dompdf:^1.0 phpoffice/phpspreadsheet:^1.18 phpmailer/phpmailer:^6.5 composer require dompdf/dompdf phpoffice/phpspreadsheet phpmailer/phpmailer
Read more

The code of Loading in Html with Css

Image
<! DOCTYPE   html > < html   lang = "en" > < head >      < meta   charset = "UTF-8" >      < meta   http-equiv = "X-UA-Compatible"   content = "IE=edge" >      < meta   name = "viewport"   content = "width=device-width, initial-scale=1.0" >      < title > Loading Animation </ title >      < style >          * {              margin :  0 ;              padding :  0 ;         }          section {              height :  100vh ;          ...
Read more

A Smile 😊 Codes in Html with Css

Image
<!DOCTYPE html> < html   lang = "en" > < head >      < meta   charset = "UTF-8" >      < meta   http-equiv = "X-UA-Compatible"   content = "IE=edge" >      < meta   name = "viewport"   content = "width=device-width, initial-scale=1.0" >      < title > Smile Shape </ title >      < style >          .maincircle  {              margin :  60px ;              padding :  60px ;              background :  yellow ;              border-radius :  100% ;         ...
Read more