CSS 2 classification properties

position: relative

This is a heading in normal position

This heading is moved left to its normal position

This heading is moved right to its normal position

Relative positioning moves an element RELATIVE to its original position.

The style "left:-20px" subtracts 20 pixels from the element's original left position.

The style "left:20px" adds 20 pixels to the element's original left position.

position: absolute

With absolute positioning, an element can be placed anywhere on a page. The heading below is placed 100px from the left of the page and 150px from the top of the page.

This is a heading with an absolute position

overflow

The overflow property decides what to do if the content inside an element exceeds the given width and height properties.

You can use the overflow property when you want to have better control of the layout. Try to change the overflow property to: visible, hidden, scroll, or inherit and see what happens. The default value is visible.

vertical-align

This is an image inside a paragraph.

z-index

Default z-index is 0. Z-index -1 has lower priority.

visibility

This is a visible heading

The following h1 is invisible

This is an invisible heading

cursor

Move the mouse over the words to see the cursor change:

Auto
Crosshair
Default
Pointer
Move
e-resize
ne-resize
nw-resize
n-resize
se-resize
sw-resize
s-resize
w-resize
text
wait
help