Hello and welcome to this lecture in this lecture we are going to create the styling for our app using
CFS.
So this is the styling where we use for our app from the external CSF file.
So I'll just run through the styling with you.
Line 1 to 5 is the first selector.
So we are using the button one I.D. selector that button one was defined in our hasty AML.
So what I'm saying here is that the pattern padding refers to the space inside the element while margin
refers to the space outside.
And they both have four corners which is top right bottom left.
So I've said one the padding to be 10 pixels for all the four corners Top Right Bottom Left border radius
or specify the to be 30 pixels border radius makes is what that gives us a square or rectangle there
around the round corners have set the background color to lime pore pattern.
No I'm I've got about an idea here call button and are again in 10 pixels.
Similar styling with the first button and then of course targets.
I've got an image.
This is the image tag.
I've said the with four or the image so all that I want all the images to have the same size and height.
So this is where I've set it.
I want the weight to be 9 5 8 pixels and the height five seven eight pixels.
You could play around with it values and change it if you wish just to see the one that suits you best
of Go or another.
I've got a class here called wrapper.
This is the container and I've set the margin.
This is the wrapper is what will wrap the images each what is what will form the main slider.
So I've set the margin from the left to move a hundred pixels.
So that's it.
The five save the styling.
Then we can have a look and see what the project looks like.
If I just refresh you can see this tiling the margin from the left eyes I used is move this from the
left one hundred pixels shifted it that way.
Okay so we've defined that using we defined that using this margin here.
So what I'm saying that from the left I wanted to shift a hundred pixels which is what he because he
was previously at the corner.
So the margin has now shifted 100 pixel this way.