CODEWITHSUNDEEP
htmlcss
rubyprince
rubyprince

Reputation: 17793

Is there any way to disregard the styles written in parent tags?

Is there any way to disregard whatever styles written, and start from scratch for a new tag. For example, if I have written a style

table {
  large amount of styles..
}

and then I want to start a new table with no styles whatsoever with something like this

<table style="no style">

I can write a different class for new table and apply the class, but the problem is that there are so many styles to override. Is there such an attribute?

Upvotes: 3

Views: 189

Answers (5)

thirtydot
thirtydot

Reputation: 228152

Just how much is a "large amount of styles"?

Considering this:

@paul...yes...I also agree, but the problem is mine is a legacy app and I have to change the style everywhere(lots of code to change) and if I miss anyone, it will result in style breaking. – rubyprince

Unless there's a joke quantity, your best bet is to override all properties defined on table to a sensible default.

To find out what the "default value" of each property is, see: How can I nullify css property?

A concrete example: http://jsfiddle.net/nE4qm/

table {
    font-size: 20px;
    color: red;
    margin: 20px;
    position: relative;
    left: 30px;
    text-align: center;
    border: 1px solid #000
}
.removeStupidTableCSS {
    font-size: medium;
    color: #000;
    margin: 0;
    position: static;
    left: auto;
    text-align: left;
    border: 0
}
.myShinyNewTable {
    color: blue
}

<table>
    <tr>
        <td>Old table</td>
    </tr>
</table>

<hr />

<table class="removeStupidTableCSS myShinyNewTable">
    <tr>
        <td>New table</td>
    </tr>
</table>

Upvotes: 2

Litek
Litek

Reputation: 4888

In your css you can use css3 pseudo selector :not():

table:not(.no_style) {
    large amout of styles
}

Than those style won't apply to table.no_style. But browser support for css3 selectors is limited.

Upvotes: 3

Jeremy B.
Jeremy B.

Reputation: 9216

Unfortunately no, there is no way to "reset" an element. This is one reason it is recommended to not give elements over-arching styles. It can become an issue later when you want to change it. You have two options.

  1. create a class instead, and give all the existing tables that class.
  2. Simply override the changes in a new class for your new tables.

Upvotes: 5

Paul D. Waite
Paul D. Waite

Reputation: 98786

Nope. You’d be better off limiting your initial large style to a class:

table.complex-styling {
  large amount of styles..
}

Upvotes: 3

simshaun
simshaun

Reputation: 21466

No & I wish there was. Unfortunately, overwriting the parent's styles is the only way to go.

Upvotes: 0

Related Questions