absolute vs fixed

[niche]

the position value for the second column in this flyout is set to fixed. This makes the flyout appear the way I need it to appear. See: http://www.lincolnsrealdeals.com/temp4.phpthe position value for the second column in this flyout is set to absolute. This makes the flyout NOT appear the way I need it to appear. See: http://www.lincolnsrealdeals.com/temp3.phpAfter reading the value definitions at: http://www.w3schools.com/css/pr_class_position.aspI can only guess at what's meant when its said "absolute generates an absolutely positioned element, positioned relative to the first parent element"What's meant by the "first parent element"?

[Howdy_McGee]

I believe that means if a paragraph tag is inside a div tag like so:

<div>	 <p>		   text	 </p></div>

Then it's going to be positioned from the div tag - but I didn't think that's how absolute positioning worked.I always thought absolute positioning moved it from the browsers left or the browsers top. Relative position moved it from where it is in the code. And Fixed position just kepted the text in one spot no matter how far the user scrolls. I mean that sounds right, right?

[skaterdav85]

You're almost there. Absolute positioning does move an element based on the browser's window (the portion where the document is displayed). However, if the parent element of the absolutely positioned element is set to relative, then the absolutely positioned element is based on that parent element. All elements by default are static. Basically, you need to give a parent element a positioning context of relative for its children elements to be positioned absolutely based on that parent element.

[niche]

So, in a parent/child situation, a parent that has a relative position and a child with an absolute position, is better form than a parent with a absolute position and a child with a fixed position.Right?

[skaterdav85]

Im not sure if 'better' is the right word. But if you want an element's position to be based on its parent element, then yes, give the parent a relative position and the child element an absolute position with top and left coordinates.

[dsonesuk]

fixed position works totally out of the flow of other elements, you set it at certain position it will go there whether it is IN any other element or not, while position: absolute position relates to its parent element be it the body or a div element it is within, if the relative div 50% width element, is on the right of the the screen, and you set the position absolute element properties top: 0px; left:0px; it go to the left most edge of the relative div not the body.

[niche]

Just to change the subject a little bit.It sounds like a fixed position is potentially problematic given the frequent use of browsers with downsized viewing areas.Right?

[Ingolme]

Kind of. It can be useful if you only use it to stick things to the top left or top right of the window.

[skaterdav85]

Just to change the subject a little bit.It sounds like a fixed position is potentially problematic given the frequent use of browsers with downsized viewing areas.Right?

go here. http://www.rdio.com/#/browse/the left side bar would be an example of fixed positioning. I wouldn't say fixed positioning is problematic. It just depends on the suitability to your particular application.

[niche]

Thanks to everyone that read and contributed. Special thanks to Howdy_McGee, big dave, dsonesuk, and Ingolme. My understand of positioning has been greatly improved because of this topic. As justsomeguy says, there's no substitute for knowing how something works and why it works.Thanks Again,Niche