CSS bottom Property


Example

Set the bottom edge of the image to 5px above the bottom edge of its containing element:

img {
    position: absolute;
    bottom: 5px;
}

Try it yourself »

Definition and Usage

For absolutely positioned elements, the bottom property sets the bottom edge of an element to a unit above/below the bottom edge of its containing element.

For relatively positioned elements, the bottom property sets the bottom edge of an element to a unit above/below its normal position.

Note: If "position:static", the bottom property has no effect.

Default value: auto
Inherited: no
Animatable: yes. Read about animatable Try it
Version: CSS2
JavaScript syntax: object.style.bottom="10px" Try it


Browser Support

The numbers in the table specify the first browser version that fully supports the property.

Property
bottom 1.0 5.0 1.0 1.0 6.0


CSS Syntax

bottom: auto|length|initial|inherit;

Property Values

Value Description Play it
auto Lets the browser calculate the bottom edge position. This is default Play it »
length Sets the bottom edge position in px, cm, etc. Negative values are allowed Play it »
% Sets the bottom edge position in % of containing element. Negative values are allowed Play it »
initial Sets this property to its default value. Read about initial Play it »
inherit Inherits this property from its parent element. Read about inherit


Related Pages

CSS tutorial: CSS Positioning

CSS reference: top property

CSS reference: left property

CSS reference: right property

HTML DOM reference: bottom property



Color Picker

colorpicker