how to override left:0 using CSS or Jquery?

I have an element, which has the following CSS:

.elem {
  left: 0;
  position: fixed;
  right: 0;
  width: 60%;
  z-index: 1000;
  }

The element does not span the whole screen. I would like it to "align" to the right hand side of the screen.

This would be easy, if I just removed left: 0, but I cannot tamper with the above CSS, so I need some CSS or Jquery to override, disable or remove the left:0 CSS.

Thanks for help!


The default value for left is auto, so just set it to that and you will "reset" it.

.elem {
  left: auto;
}

Make sure that the above comes after the original CSS file.


Using CSS:

.elem {
    left: auto;
}

Using JQuery:

$(".elem").css("left", "auto");

Try auto property in CSS, which is equal to the default value.


With jquery:

$(".elem").css("left", "");