use margin or position relative to position elements

Belovts

New Member
I have always used margin to move a floating div to the correct position in a parent div (say the logo div within a header div). This has always worked but that meant you have to play with the individual height of the elements else it will affect the remainder of the layout downwards.I found another method today and that is to make the logo div position: relative; and then use example top: 20px; to move the element around, and this does not appear to affect the layout. I don't want to adapt to this without knowing that there may be other implications, so can anyone point out common flaws in either of the above methods or possibly suggest a better solution?\[code\] // Sample HTML <div id='header'> <div id='logo'> LOGO GOES HERE </div> </div> // Sample CSS #header { height: 100px; } // Version 1 #logo { float: left; margin-top: 20px; } // Version 2 #logo { float: left; position: relative; top: 20px; } \[/code\]
 
Back
Top