Help:Wiki University Wikitext--Position - Absolute

Absolute positioning
Here is an object which we place 120 pixels from the top and 120 pixels from the left side of the page. 
 * It is like relative positioning, but it differs in fact that it does not create a space in the flow of the page.
 * Absolute position put the object in a certain spot regardless of what is around it.
 * In fact it will cover up anything that is in that spot even another absolute positioned object.
 * NOTICE our object covers part of the sidebar.

Placing a absolute positioned object
Here is the coding for our absolute position object: 
 * NOTICE position:absolute.
 * NOTICE left:120px. If we would have use 220 pixels the sidebar would not be covered.
 * NOTICE top:430px.
 * So what happens if you don't specify the position in pixels? It places itself up against the object above it.

Absolute inside relative positioning
  
 * One of the main problems with absolute positioning is that if you add new material at a later date above the object you will have to move it down as it will not move automatically like relative positioning does.
 * In order for absolute positioned objects to move like relative positioned objects you have to place absolute positioned objects INSIDE relative positioned objects.
 * Relative positioned objects WILL MOVE when new material is added above it even if there is an absolute position object inside of it.
 * Here is the coding for a relative placed object that has a red border with a absolute positioned blue box placed inside it.
 * Here's the coding:
 * NOTICE the absolute positioned blue box coding is between the opening and closing div tag in red.
 * You can have as many absolute positioned objects as you want between opening closing relative position objects.
 * Absolute position objects behave inside relative positioned objects as if they were isolated objects on a page.

Try these out
 Exercises Check your answers
 * Take this object and place it 75 pixels to the left and 20 pixel from the top from where your browser wants to put it:
 * Take this object and place it 275 pixels to the left and 50 pixel from the top from where your browser wants to put it:

 Quick Quiz
 * Relative positioning places objects in relation to the edge and top of the page.
 * A. True
 * B. False


 * Relative positioning does not cover objects placed before it was.
 * A. True
 * B. False


 * Relative positioning covers up all objects covered after it was placed.
 * A. True
 * B. False

Check your answers