Introduction to CSS Position - Lesson 10

1. Introduction to CSS Position - Lesson 10 Publisher : Attitude Academy

2. What is Position CSS The Css Position CSS helps you to position your HTML element. You can put any HTML element at whatever location you like. You can specify whether you want the element positioned relative to its natural position in the page or absolute based on its parent element. There are four choices for values: static relative absolute fixed Some properties is also usealong with the position property to move an HTML element anywhere in an HTML document. There are four choices for values: Top Bottom Left Right (Note: any two properties use with position in one time)

3. POSITION The Position static position: static; Static positioning is by default the way an element will appear in the normal flow of your HTML file. It is not necessary to declare a position of static. position: static;

4. POSITION The Position Relative Positioning an element relatively places the element in the normal flow of your (X)HTML file and then offsets it by some amount using the properties left, right, top and bottom. This may cause the element to overlap other elements that are on the page, which of course may be the effect that is required. position: relative; left:20px top:50px;

5. POSITION The Position Absolute Positioning an element absolutely, removes the element from the normal flow of your HTML file, and positions it to the top left of its nearest parent element that has a position declared other than static. An element with position: absolute is positioned at the specified coordinates relative to your screen top-left corner. position: absolute; left:20px top:50px;

6. POSITION The Position Fixed Fixed positioning allows you to fix the position of an element to a particular spot on the page, regardless of scrolling. Specified coordinates will be relative to the browser window. position: fixed; left:0px top:100px; float:right

7. Visit Us : Attitude Academy