Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Turn off CSS property

Tags:

css

overriding

Lets say I have a plugin's CSS which loads later as my style.css

/*style.css*/
.something {
position:absolute;
left: 0px !important;                       
}

/*plugin's CSS*/
.something {
position:absolute;
left: -50px;                       
} 

/now it has 0px but i want no left value at all/

i know i can set !important so that property wont be overriden, but is there any solution to turn "left" off as Chrome DevTools uncheck a property?

like image 971
user1582524 Avatar asked Aug 13 '12 17:08

user1582524


People also ask

How do I remove a property in CSS?

Use the style. removeProperty() method to remove CSS style properties from an element, e.g. box. style. removeProperty('background-color') .

How do you override and remove CSS properties?

There are several ways to overwrite CSS properties from external libraries. Case 1: if you're using Bootstrap or Zurb Foundation via npm package, you need to change a variable value that is responsible for given property and place it after importing all library files to ovewrite correctyly eg.

How do you unset all styles in CSS?

There is a property called all that is being proposed for resetting all CSS properties for a given element to certain CSS-wide values - the value you want to use would be unset , which resets a property to either its inherited value if it inherits by default, or otherwise, its initial value.


2 Answers

As far as I am aware (someone please feel free to correct me) there is no way to directly "turn off" a CSS property like in the Chrome DevTools.

The closest you can get it to reset the property to its default. In your example, it would be "left:auto;"

P.S. You may wish to adjust your tags to get more views and hopefully answers.

like image 171
Gravitate Avatar answered Oct 06 '22 10:10

Gravitate


You should use the "auto" value for left:

.something
{
    position:absolute;
    left:auto !important;
}

"auto" will reset to the default (that is set by browsers for that style)

more info here: http://www.w3schools.com/cssref/pr_pos_left.asp

like image 44
Software Guy Avatar answered Oct 06 '22 10:10

Software Guy