CSS Absolute

CSS Tutorial  >  Position  >  Absolute

The absolute value of the position property means that the element will be displayed in the same location within the browser, with the location being determined by top, bottom, left, or right properties. The element will move with the rest of the content when scrolling. As an example, you will see a red ball 200 pixels from the top of the browser and 600 pixels from the left of the browser. The code for this is:

p {
  position:absolute;
  top:200px;
  left:600px;
}

The HTML code,

<div>
  <p><img src="red-ball.jpg">
</div>

renders the image you see that is 200px from the top of the browser and 600px from the left of the browser. Please notice that as you scroll up and down and page, the red ball moves along with the rest of the page. This is different from when we specify {position:fixed;}, when the red ball stays in the same place as the rest of the page moves.

Next: CSS Relative



Copyright © 2013   1keydata.com   All Rights Reserved   Privacy Policy

CSS Tutorial
CSS Syntax
Apply CSS
CSS Media Types
CSS Cascade
CSS Inheritance
CSS Class ID
CSS Div Span
CSS Length Units

CSS Box Model
CSS Margin
CSS Border
CSS Padding
CSS Background
  CSS Background-attachment
  CSS Background-color
  CSS Background-image
  CSS Background-position
  CSS Background-repeat
CSS Color
CSS Font
CSS Link
CSS List
CSS Table
CSS Position
  CSS Absolute
  CSS Relative
  CSS Fixed
  CSS Static
  CSS Top
  CSS Bottom
  CSS Left
  CSS Right
  CSS Overflow
  CSS Z-Index
CSS Text
CSS Float
CSS Clear
CSS Cursor
CSS Wrap

CSS Codes

Resources

CSS Tutorial German