Hello and welcome.
In this video I will be explaining what the CSA box model is.
What is their Seer says box my look.
Singer says box model is essentially a box that wraps around every hastier male element.
NCAA says the term mbox model is used when talking about design and lay out the box model comprises
of several components of parts.
So we have the margin which is the space around the outside of the element.
Next we have the border.
This is the solid line that sits outside the padding with the padding.
This is the space around the content.
For example you have a paragraph.
The space around the paragraph can be regarded as the padding and then we have the tool content.
This is the area where the text the images are that content you have on the page.
This is where it appears to show you what the box model looks like.
Just few go any basic web page or pull on but there use this web page.
I have been working on so find the Course find school expand their web page so you can see the box model
properly so all you need to do is just right click on any elements.
See.
Right click on the image element and click on inspect and that will show the box model.
You can see this is the box model here.
This area here.
So that's the margin and he has four sides.
The top will go the right the left the button next go the padding.
Also the padded has four sides.
We've got the top the right the bottom from the left and here.
This is the content.
So this is where all the cont'd the pay you will appear like it is and so on.
That's where we appears so this is a content area.
And then you can see the border.
You can see this is the border which sits just on top of the padding so you can see the border goes
around the pad in and the content.
You can assign values to the marjean the border and the padding property so just by using csx you can
assign pixel values to them.
And when you apply values the values depending on the number of values.
Remember that the margin and the padding.
They have four sides.
The top right the bottom on the left.
So depending on if you adding four values then it would be applied to the four sides.
But if you only apply in two values then they would be distributed accordingly.
In the next feed you will go into experiment adding values to margin and padding so that you can see
how the various values work.
When you apply them so that's it for this P2 or C access mbox model.
Thank you for watching and have fun there.