Search within TutorialsPark

CSS padding Property


A shorthand to set the padding of the element


Definition and Notes.

1. The CSS padding property is a shorthand to set the padding of the element in a single declaration

2. It specifies the empty space in-between the element and its borders, it can assume only positive values.


a. padding: 10px 15px 20px 25px (i.e clockwise starting from top)

10px : top

15px : right

20px : bottom

25px : left


b. padding: 10px 15px 20px (i.e clockwise starting from top)

10px : top

15px : right and left

20px : bottom


c. padding: 10px 15px (i.e clockwise starting from top)

10px : top and bottom

15px : right and left


d. padding: 10px

10px : all edges of the element


Syntax:

CSS padding property. internetexplorer safari firefox opera chrome

View in Splitscreen»

Code-Editor:

Note-In case you omit some values for shorthand, then the best match is applied. .

Property Values

Value Description
length To specify the length using length units (px, pt, em , cm etc)
% To specify the length using percentages values
inherit The value for margin is inherited from the parent element

Specifications

Specs Value
Name padding
Value [<length> | <percentage>] {1,4} | inherit
Initial Value See Individual Properties
Applies to all elements.
Javascript syntax object.style.padding="10px"
Inherited No
Percentages relative to the containing box
Computed Value See Individual Properties
Browser Support internetexplorer safari firefox opera chrome

Related Examples.