WHAT IS CSS BOX MODEL, MARGIN AND PADDING | CSS TUTORIAL FOR ABSOLUTE BEGINNERS ✌️| #7

In this tutorial, we are going to study the concept of the box model in CSS. The box model is a very important topic of CSS and if not understood properly, it can create a lot of confusion in the future. It is the basic framework of web development whether you are making a website using any other language such as Angular or React. The box model helps us to define the padding, border, and margin around an element.

Instagram Link : https://www.instagram.com/i_safdarali/

►Check out the HTML Tutorial here: : https://www.youtube.com/playlist?list=PLb7va_1xm_pV2eQ0fPPakFZ-P5aVHVy9q

CSS Code as described/written in the video:
Can't add angled tags as per YouTube guidelines please refer video for that,

* {
box-sizing: border-box;
margin: 0;
padding: 0;
}
body{
background-color: #e6cbf8;
}

.container{
background-color: rgb(231, 230, 241);
border: 3px solid rgb(64, 6, 119);

/* We can set margin/padding for top, bottom, left and right like this */
/* padding-top: 79px;
padding-bottom: 79px;
padding-left: 34px;
padding-right: 79px;*/

/* margin-top: 3px;
margin-bottom: 5px;
margin-left: 34px;
margin-right:5px ; */

/* margin = top right bottom left; */
/* padding = top right bottom left; */

/* padding: 23px 56px 6px 78px; */
/* margin: 23px 56px 6px 78px; */

/* padding: y(top/bottom) x(left/right); */
/* margin: y(top/bottom) x(left/right); */
padding: 34px 19px;
margin: 14px 19px;
border-radius: 23px;
width: 533px;


}




.
Do like, share, and comment ❤️ Share it with your Friends ❤️
Also, Like and share ❤️

╔═╦╗╔╦╗╔═╦═╦╦╦╦╗╔═╗
║╚╣║║║╚╣╚╣╔╣╔╣║╚╣═╣
╠╗║╚╝║║╠╗║╚╣║║║║║═╣
╚═╩══╩═╩═╩═╩╝╚╩═╩═╝

------------------------------------------------------------------------------------------------------------------------


#css #html #webdevelopment #webdesign #freelancing #informativevideos #visualstudio #dailyvlog #dailyvideo #safdarali #codewithsafdar