Computer >> Computer tutorials >  >> Programming >> CSS

Absolute Positioning with CSS

An element with position: absolute is positioned at the specified coordinates relative to your screen top-left corner.

You can use two values top and left along with the position property to move an HTML element anywhere in the HTML document.

  • Move Left - Use a negative value for left.
  •  Move Right - Use a positive value for left.
  •  Move Up - Use a negative value for top.
  •  Move Down - Use a positive value for top.

Example

You can try to run the following code to implement absolute positioning −

<html>
   <head>
   </head>
   <body>
      <div style = "position:absolute; left:80px; top:20px; background-color:yellow;">
         This div has absolute positioning.
      </div>
   </body>
</html>