tags:

views:

155

answers:

4

Is this going to cause me untold grief if I stick it at the top of my stylesheet?

* {position:relative}
+7  A: 

Is this going to cause me untold grief if I stick it at the top of my stylesheet?

Yes. You will not be able to work with absolutely positioned elements any more, for example - the absolute positioning will always be relative to the parent element, which is almost never the desired result.

I could imagine there are even more side-effects field of z-index settings.

Not a good idea IMO.

And no, position: static is not deprecated, after all, it is the default setting :)

Pekka
Mm I try not to nest elements that are absolute relative to the viewport anyway.I was hoping it would actually reduce potential z-index issues between firefox and ie.
David Meister
@user278457 You won't even be able to position absolute to the parent's parent element any more that way. And correct me if I'm wrong, but I can't see how this will fix cross-browser z-index issues.
Pekka
Ok, I think I see what you're getting at. I just don't think that way, or haven't needed to yet. I'd rather use two "left:10" than a "left:10" on the parent and a "left:20" on the child. I suppose it's a good idea to leave the option open if you're not feeling particularly disciplined one day.
David Meister
@user278457 if it's for a small, personal home page, it's probably never going to be a problem, but anything that could grow in the future, I wouldn't recommend it.
Pekka
+3  A: 

It's a bad idea imho as it changes the default behaviour of elements without clear indication and it will have unforseen consequences.

If you really want to have most elements positioned relative, you might want to think about just making div and similar relative.

dbemerlin
Much better idea. I think I'll experiment with sticking a div{position:relative} into my css reset.
David Meister
@user278457 still a horrible idea. It may work for you now, but what if one day you need absolute positioning, or have to include an external widget.
Pekka
I could give something an absolute position still. I just won't nest it in another div. I really don't see why you would nest something that is positioned relative to the viewport. You mean if I'm designing something that should be included on an external site, right?
David Meister
@user278457 In my experience, it's not unusual to have absolutely positioned elements not relative to the body, but to a different element that has `position: relative`.
Pekka
+2  A: 

Answering title question:

This is the current CSS 2.1 spec:

http://www.w3.org/TR/CSS2/visuren.html#propdef-position

Accepted values include static, relative, absolute, fixed and inherit.

I'm not sure about CSS 3 (it's still work in progress) but they don't seem to mention static:

http://www.w3.org/Style/CSS/current-work#positioning

Whatever, I wouldn't really care yet :)

Answering body question:

The default is static so you'd be changing the property for every single item in the page. The best you can achieve is nothing. The worse is that you'll be probably creating weird side effects you won't even notice at first sight.

Also (this is pure speculation on my side), it can't be good for performance. I'm sure rendering engines are optimized for having a majority of static elements.

Álvaro G. Vicario
Good point. But the way they describe position relative implies that it is "relative" to some mysterious unnamed property that operates "as defined by the box model"
David Meister
+1  A: 

Good answers all around. I will add:

1) Relatively positioned items can't be floated, which severely limits your ability to build a table-free layout (and to do a lot of other useful things with CSS).

2) Wildcards can cause performance issues when not used carefully. That would probably not be the case in your example, but it's a bad practice to make a habit of.

Tim
id consider the floating issue the biggest problem. since asking this question, i've moved to floating just about everything in my DOM so i'm kind of shooting myself in the foot with this wildcard declaration hey?
David Meister
Yes, I typically avoid wildcards altogether in CSS. It's rare that you can conclusively say you want any behavior to apply to ALL elements. Relative positioning definitely has its uses; just apply it when you need it via a specific CSS class or even a jQuery selector.
Tim