How Many Types of Positioning in HTML i want to learn more about HTML positions plz you deeply explain me if anyone know about it. relative, static, inharite, i need more and its descriptions how we utilize it and why
http://www.barelyfitz.com/screencast/html-training/css/positioning/ http://www.w3schools.com/cssref/pr_class_position.asp http://www.w3schools.com/css/css_positioning.asp All you need to know about them you will find there. First link is very good to learn about positions.
That's CSS programming, and not exactly HTML code. I would look at those w3school links that Hefaistos provided to you, as that's the same website I use as well and have been programming this code for 13+ years......
See the Visual Formatting Model. This is the section you should become completely at home with. However, you should not use any but the default position value, static, for major layout sections until you know css layout so well that you rarely need the position property. Each of the other values, relative, absolute, and fixed have so may big toothed gotchas that you should avoid them unless there are compelling reasons otherwise. cheers, gary
Hi ! i give you example of positioning. Positioning Elements by example 'Absolute' Positioning Ex :- #outer {position:absolute; top: 200px; left: 200px; color: red;} #inner {color: green;} 'Relative' Positioning Ex :- #outer {position: relative; color: red;} #inner {position: absolute; top: 200px; left: -100px; height: 130px; width: 130px; color: green;} 'Static' Positioning Ex :- #outer {/* position: static; */ color: red;} #inner {position: absolute; top: 200px; left: -100px; height: 130px; width: 130px; color: green;} For More Info : http://www.w3.org/TR/WD-positioning-970131
Positioning elements in an HTML page is usually done through the CSS stylesheet. The position property defines how an element will be positioned on a page - relative to it's position in the XHTML or relative to the top left corner of the browser window. Position: static | relative | absolute | fixed | inherit static A normal box, subject to the normal flow. relative Box is in normal flow, offset relative to its normal position. absolute The box is placed in an absolute location relative to the container block. fixed The box is placed in an absolute location relative to some reference point. inherit The element should have the same position value as the parent element.
Using infoway111's list: position: static | relative | absolute | fixed | inherit static A normal box, subject to the normal flow. The default position value. If you use another value to fix a problem, you have two problems. relative Box is in normal flow, offset relative to its normal position. Two gotchas in one. If offset, the visual rendering is out of the flow: it can't see other elements, nor can other element see the offset position. The offset will overlie or underlie other elements depending on the stacking order. The original spot in the flow is preserved as if there had been no offset, leaving a hole. This explains why you'll see pages with elements that have ever larger negative offset values; trying to fill one hole by digging a deeper one next to it. This value is used most often to set the containing block for a descendant absolute positioned element. absolute The box is placed in an absolute location relative to the container block. Another two-fer. The containing block is the nearest ancestor with a position value other than static, not necessarily its parent. This element is out of the flow and invisible to other elements, and vice versa. Over- and underlie apply as above. fixed The box is placed in an absolute location relative to some reference point. Except for print media, the reference point is defined as the viewport. Since the root element, by definition takes up the entire viewport, you may think of the html element as the reference containing block. Like absolute, this value puts the element out of the flow. Soi-disant designers who are deeply into the print meme tend to use this value; "I want the footer/header/navigation to always be on the page", forgetting that people, and by people, I mean each and every jack-leg who has ever used a browser for more than five minutes, know how to scroll the page to see anything beyond the viewport. The scroll bars and the back button are the most used features of a browser. That said, a fixed element is a waste of precious screen real-estate. It is nearly always a Bad Idea. inherit The element should have the same position value as the parent element. :shrug: Position is a property that can wreak havoc, and should probably be explicit for any value other than static. cheers, gary