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>
	

A paragraph positioned with CSS.

Top

© 1996 - 2009 Killersites.com – All rights reserved

• Killersites.com Support:

• stefan@killersites.com
• 514-932-8091 (10 to 5)

• Questions about the videos:

• videos@killersites.com

• Hosting and domain name support:

• (480) 624-2500