GetSimple Support Forum

Full Version: How can I get rid off reset.css rules?
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
Hi,

please look at the attached screenshot:

I would like to style a table under Innovation scheme, but the only way to kill those reset.css styles is using !important;
I tried

Code:
<style>
td {
 border:1px solid orange !important;
}
</style>

next to the table html, but without !important nothing happens Sad

(It is the standard reset.css, only compressed, so that only line 1 exists.)

I thought css is hierarchical, the more specific commands rule? How can reset.css be the "chief"??

Bye
Hypertexter
You are using less specific property ('border') than reset.css does ('border-left-color', for instance)

Now you can either specify all 'border-xxxx-yyy' properties or decompress and edit reset.css according to your needs.
I tried

<style>
td {
border-left-color:1px solid orange !important;
}
</style>

in html and nothing happens. This even does not produce an orange which is overwritten later...


And another question:
I thought I should never edit reset.css. Could I get the same effect with editing my style.css instead? And what is "stronger": style.css or <style> section in html?

Thank you...
Give your table an id and use that
#tablename td{
(2015-09-05, 23:41:32)shawn_a Wrote: [ -> ]Give your table an id and use that
#tablename td{

But then I could use inline elements - or stop using CSS...

I really would like to replace the reset.css and use something else - but I still do not know why my browser freezes without it:

http://get-simple.info/forums/archive/in...-7168.html
well your css is wrong also.
border-left-color:1px solid orange !important;
is not a valid declaration

And i doubt vallhund comments apply to your situation at all.

What rule is being reset in innovation exactly ?

Oh this is your browsers reset....

nm, you just need more selectivity in your styles... or use classes and ids

Code:
.wrapper td{
  border:1px solid orange;
}
article,section whatever
Hello shawn_a,

I'm sorry, I am a german native speaker and do not understand everything:


Quote:border-left-color:1px solid orange !important;

is not a valid declaration

But the reset.css works with that.?


Quote:What rule is being reset in innovation exactly ?
I don't know: I use the standard reset.css of innovation theme, just compressed.


Quote:Oh this is your browsers reset....
What is my browser doing? Is this the explanation for the "freeze"?

Thank you,

Hypertexter
your browser has its own reset.css innovation does not reset tables
If i add this
Code:
table td{
    border:1px solid orange;
}

to the bottom of my style.css it works fine.

Not sure i understand the problem, perhaps it is browser specific.
Try another browser.
Quote:
Code:
table td{
    border:1px solid orange;
}
works for me, too. Thank you.

But yes, reset.css resets tables:
Code:
table { border-collapse:collapse; border-spacing:0; }

And what I do not understand at all: that seems to have priority over the following html styles:
Code:
table {
border-collapse: separate !important;
border-spacing: 15px !important;
border: 2px solid black !important;
}

... which only work with !important.
Those are irrelevant overrides.

Also you dont typically assign global css rules like that.
Like i said you need to learn css specificity.
(2015-09-07, 10:17:38)shawn_a Wrote: [ -> ]...
Like i said you need to learn css specificity.

I am very proud to present:

Code:
<style>
table.class1  {
   border-collapse: separate;
   border-spacing: 0px;
   border: 2px solid black;
}
table.class1 td {
   border:1px solid orange;
   padding:10px 0px
}
table.class1 th:nth-child(2), table.class1 td:nth-child(2) {
   padding:10px 30px
}
</style>

Big Grin
Thank you!
Or use your themes parent containers

article table{}
.wrapper table{}