Search within TutorialsPark

CSS3 bottom Property


To Specify the bottom offset of a positioned element


Definition and Notes.

1. The CSS bottom property defines the offset between the bottom outer margin edge of a positioned element and its containing block.

2. For elements positioned as absolute or fixed, it sets the distance between the bottom margin edge of the element and the bottom edge of its containing block.

3. For elements positioned as relative, it sets the distance the element is shifted above its initial position

Syntax:

CSS bottom property. internetexplorer safari firefox opera chrome

View in Splitscreen»

Code-Editor:

Note-The property top overrides the bottom property, hence if the top is not auto, the computed value of bottom is negative of the computed value of top property.

Property Values

Value Description
length Sets the value in length units. Values can be positive, negative and null.
% The values are specified as the percentage of containing block's height.
auto Leaves it to the browser to calculate the position of the bottom edge
inherit The values for the bottom offset is inherited from the parent elements value

Specifications

Specs Value
Name bottom
Value <length> <percentage> | auto
Initial Value auto
Applies to Positioned Elements (i.e elements with position property other than static)
Javascript syntax object.style.bottom="100px"
Inherited No
Computed Value For relatively positioned elements, see description; for static elements, auto; for length values, absolute length; for percentage values, the value in percentages, or else, auto.
Browser Support internetexplorer safari firefox opera chrome

Related Examples.