The cover of The Complete Idiot's Guide to Create a Web Page The Complete Idiot's Style Sheets Reference

| Index | Current Category: Positioning |
| Previous Style: border-width | Next Style: caption-side |


bottom

The element's position from the bottom of the browser window (if you're using position: absolute or position:fixed) or from the bottom of the element's natural position in the page (if you're using position: relative).

Support:

W3C StandardInternet ExplorerNetscape Navigator
CSS2 and later 4.0 and later Not supported

See Also:

left, right, top

Possible Values:

auto
The default position according to the normal HTML layout.

Support:

W3C StandardInternet ExplorerNetscape Navigator
CSS2 and later 5.0 and later Not supported

[length]
An absolute position.

Support:

W3C StandardInternet ExplorerNetscape Navigator
CSS2 and later 5.0 and later Not supported

Notes:
  • You can use negative numbers.

[percentage]
The position as a percentage of the current block size.

Support:

W3C StandardInternet ExplorerNetscape Navigator
CSS2 and later 5.0 and later Not supported

Example:
<DIV STYLE="position: absolute; right: 600px; bottom: 150px">Section 1</DIV>
<DIV STYLE="position: absolute; right: 100px; bottom: 100px">Section 2</DIV>
<DIV STYLE="position: absolute; right: 500px; bottom: 50px">Section 3</DIV>
<DIV STYLE="position: absolute; right: 50px; bottom: 0px">Section 4</DIV>
This is regular text. Even though it comes after all those <DIV> 
tags, it still appears at the top of the page. That's because elements 
that are positioned absolutely aren't part of the regular document flow.
<P STYLE="position: relative; right: 200px">
This paragraph is shoved right from its normal position by 200 pixels 
using relative positioning
How It Looks:
See an example page that demonstrates this property.

| Index | Current Category: Positioning |
| Previous Style: border-width | Next Style: caption-side |