CSS absolute Positioning Example

CSS Absolute Positioning

An Example of CSS Absolute Positioning

Code:

  <div id="Layer1" style="position:absolute; 
    background: #999966; left:100px; top:265px; width:380px; height:27px; z-index:1"> 
    Absolute postioning</div> 
	

The above code snippet demonstrates how we can position a div using CSS to any position on the page right down to the pixel! This type of control was not possible before CSS.

NEW WEB DESIGN VIDEO: Learn web design with HTML and CSS

You can also position any HTML element with CSS positioning just as you would a div tag.

You can see in the example below how I positioned a paragraph (<p></p>) in the same way.

Code:

  
   <p style="position:absolute; background: #C5C5C5; 
    right:300px; top:700px; width:390px; height:27px; z-index:1"> A paragraph 
    positioned with CSS. </p>
	
Absolute postioning of a div to a random spot on the page.

A paragraph positioned with CSS.

Top
© 1996 - Killersites.com – All rights reserved