Guideinfoyou: Html CSS Using Padding Properties

Hello everyone we know we've got very far in our topic about Html and CSS codes, well again I like to introduce to you our Padding properties using our CSS codes.

Padding properties are defines the spaces in our border to the contents pages, it is same in our margin properties that we can adjusting our border spaces and styling our margin text content into our border.

For the Margin codes CSS tutorial you can look from here that you can read our Margin properties CSS.
Html CSS Using Margin

Property Padding having (4) four value codes.

Padding properties having four (4) value or four (4) sided codes as the same of the margin properties CSS.

Padding:10px; = This code are putting all side Padding by 10 pixels.

Padding:10px 20px; = In our property padding that having two value this is about from Top and bottom that give you value padding by 10 pixel and the left and right padding is 20 pixels.

Padding:10px 20px 40px; = Property Padding having three values, our Top Padding is 10 pixel, Left and right Padding 20 pixel and our Bottom Padding is 40 pixel

Padding:10px 20px 40px 60px; = Property Padding property with four value by Top, Left /Right and bottom.

Our top is 10 pixel
Right is 20 pixel
Bottom is 40 pixel
and Left is 60 pixel

Example in our browser all sides:

10 pixel for our border padding in their all side.

Example in our browser two value in our Property padding:

Padding codes for the two value in our property Padding check what the difference in our sample all sided.

Example in our browser three (3) value in our Property Padding:

Padding of three (3) value in our content and adjusting the spaces of our side content text , check it out what our browser looks like.

Example in our browser four (4) value in our Property Padding:

Padding of four (4) value, this is all sided value in our padding CSS codes it is the same for our margin property CSS, let us check in our browser.

Hope you see the different of them,

Using Padding and Margin properties code:

I use the border codes that you can understand the spaces and adjusting about our Padding codes CSS.

Combining our property margin and property padding in our content pages, how they looks like and what is the differences of them.

Setting your own space using Padding codes CSS

Padding properties that follow by your codes for not using all sided spaces in our border content.

Padding-top
Padding-right
Padding-bottom
Padding-left

Example how to use our own code sides Padding:

Example of our padding right content text by our choices spaces and to be adjust our margin, let us see what's happen.

Now it's done for our Padding codes using CSS, if there is any question or error in the tutorial, just comment and you can share what you have learn too. See yah and good luck. :)

Next to Html CSS Using Width And Height

Return to:
Html Tutorial Introduction

Html Structure And Method

Basic Tags and Formatting

Adding links in Html Hyperlinks

Html Instruction Formatting Text

Html Working With Fonts

Html Creating Lists

Html Adding Images To Our Pages Or Website

Html Creating Image Maps
HTML Table Border

HTML Marquee Tag Direction
HTML Marquee Image Attribute