In this lecture you're going to look at CSSA box model.
And this is the year you will really start to style the page using Boxleitner.
Take a look at this diagram.
There were four boxes.
There is a content box bedding box motor box and much in box.
And I'm going to talk about each one of these in this lecture.
The first box is of course is the content box and we have been using it.
Everything goes inside it.
If it is it takes images video.
Everything was inside this content box.
Every single element on a web page has these four boxes on the margin border and padding boxes are invisible
unless we specify them.
The painting is invisible border is invisible and the margin is also invisible.
Let us experiment with these four boxes.
This is a page from simple business web page.
Let me show you the box model in a crumbling school because this is the best way to see these boxes
in action.
Click on Hedding.
So this is the box model for H2 element.
You can see this is the content box.
This is the betting box.
This is the border box.
And this is the model.
This model is applied by the Groll bros itself.
What example if I add one pixel to green include.
Now this is the content and this is the border around this element.
Brading
EXOR and pixel
conflicts are Antrix.
Now do you see the green bodies on the element.
This is bedding and this is barter.
There is some margin guarantee
and keep some contributes
and can decrease
in Saudi and you can take weeks earlier.
This is the bottom.
OK.
This is a concurrent itself.
This is depending on the content.
This is the border.
And this is the margin you see these orange box on the element.
So this is the box order
birding is used to generate spaces are all contained the margin is also used to generate space around
the content but outside of the box is just a border or an element.
So this is just good idea about this box and order in the next lecture you learn about thesis classes
and ideas.
It is very important to lecture to the.