CSS - change position absolute left to right in IE

How can I override this declaration?

div.someClass {position:absolute; left:10px; top:20px}

I want this

div.myClass div.someClass  {position:absolute; RIGHT:10px; top:20px; left:auto;}

You can say, tha开发者_如何学JAVAt it should work if I set left:auto; but it is not working in IE6, I didn't check what happen in IE7, IE8.

How to change position using only CSS?

This is one of the problems with CSS: How do you "unring" that bell, once a certain type of rule has been set?

Assuming your div is not in a container that does not have its left value set already, you could try this:

div#myId div.someClass {
  left: inherit;
  right: 10px;
  /* etc. */
}

Note that you could have saved yourself some trouble by not declaring div.someClass in the first place. The extra element in the selector is just unnecessary weight. If your selector had been .someClass you could have overridden it merely by adding div.someClass.

You mean that you want the "myID" div to not obey that rule, even though it has class "someClass"? Then you'd just put this after your ".someClass" rule:

div#myId { right: 10px; left: auto !important; }

(The "!important" might not be necessary; try it with and without that, and if it works without it then leave it off.)

If you mean that you want all <div> elements with class "someClass" that appear inside a <div> with "id" "myId", then your selector is OK but try that "!important" suffix.

Here's a sample showing that setting "left" to auto definitely works: http://gutfullofbeer.net/leftright.html

you can override to nothing (at least with javascript):

 divObject.style.left = "";