Will floating and positioning elements relatively break layout?

[Zygoma]

Buon Giorno from Pitch black 9 degree C Wetherby UK,

I'm in the midst of designing the layout of the header section of a website> Now so far Ive been positioning elements by floating & positioning relatively as illustrated here: http://i216.photobucket.com/albums/c...t-theory-1.jpg

But something concerns me which is whether not positioning relatively and doing lots of floating will increase the chances of the laout breaking. So my question is please:
"Does floating and positioning elements relatively increase the chances of the layout breaking of yes whats the alternative?"

Thanks in advance,
David

[dresden_phoenix]

It really depends on HOW it's done.

CSS is nto really a LAYOUT LANGUAGE per say. So once more the answer is to THINK and GAUGE the specific code you have written.

Some things you should know ( if you dont know already):

1) positioning an element relatively may have an effect on descendant elements which have position: absolute, as it becomes the positioning context for all decedents until either another position:relative or position:absolute parent is created.

2) relative positioning moves the element , but not the space it takes up.

3) potentially you could achieve the same horizontal shift with margin

4) Sometimes you will see float/position relative as a fix to IE issues ( but I tend to favour the idea of dont fix what isnt broken, so if your code doesnt exhibit IE bugs, I'd consider foregoing the position:relative fix)

If your math is on target, and your code compliant your layout should not break ( whether you use floats/ or not).

for example. if you floated two elements one 80% and one 200px wide contained in a full width div, your layout will break anytime your view port is less than 1000px! .8*1000 +200=1000 This not the result of bad code , just mathematics. So, if we can mathematically anticipate such situations we can put a caveat on the PARENT ELEMENT (min-width:1000px or even an media query) to prevent the situation.

hope that sheds some light on the subject

[Zygoma]

Perfect Thank you :-)