p{
padding: 20px;
padding-left: 10px;
padding-right: 5px;
padding-top: 15px;
padding-bottom: 30px;
}
				
			

				
					
p{
padding: 20px 10px;
padding: 10px 5px 15px 30px;
}
padding: 20px(top/bottom) 10px(left/right);
padding: 10px(top) 5px(right) 15px(bottom) 30px(left);
				
			

Video Summary

Alright guys, we’re gonna go over CSS padding. And basically, the CSS padding is the space between the content that your element is having and the border around it. So this is how we’re going to be able to space out and manipulate the visual appeal of having that border and being able to do that your tax right against the border and have a little bit more faith. So look at it and read your content a little bit easier. And the way that we do this is basically we just use the padding property and we can go and say 20 pixels. So if you just do padding 20 pixels, you’re getting 20 pixels of spacing between your text and the border, and that’s a top left bottom and right, but if you want to isolate different sizings for each side, you can do that by specifying padding, left padding right padding top and padding bottom. Now there is a shorthand version to this, where you can go in and say padding 20 pixels and 10 which means that the top and bottom is getting 20 pixels of space. And the left and right are only getting intent. That’s the space. Also too as you can see a shorthand version where it says 10 515 and 30 pixels and basically that goes top right bottom left. So you’re gonna run into this from time to time and if you end up mastering this, it does save you a lot of time from then having to go in and type out padding-top padding left, you know if especially if you’re if you know that your top and bottom are gonna be the same, Your left and right are gonna be the same or if you know exactly the, the exact measurements that you’re going to want to use. So with that being said let’s hop over to code pen and start playing with this padding property.