CODEWITHSUNDEEP
htmlcss
Asim K T
Asim K T

Reputation: 18164

Use user agent style

Is there a way to use user-agent styles no matter what?

for example I want the normal color behavior of anchor elements for a specific section.

CSS:

  .reset a {
    color: initial;
  }

  .reset a:visited {
      color: initial;
  }

  .reset a:link {
      color: initial;
  }

  .reset a:active {
      color: initial;
  }

  .reset a:visited {
      color: initial;
  }

  .reset a:hover {
      color: initial;
  }

don't work;

http://codepen.io/asim-coder/pen/rjNWxZ

Upvotes: 0

Views: 98

Answers (3)

Hardik Kalathiya
Hardik Kalathiya

Reputation: 2253

Use this code.

HTML

<section>
<a href="#">sample one</a>
  <div class="reset">
    <a href="#">two</a>
    <a href="#">three</a>
    <a href="#">four</a>
  </div>
</section>

CSS

.section a, .section a:visited, .section a:link, .section a:active, .section  a:visited, .section a:hover {
   color: initial;
  }

Upvotes: 0

pix1289
pix1289

Reputation: 514

Try this way:

.section a, .section a:visited, .section a:link, .section a:active, .section  a:visited, .section a:hover {
   color: initial;
  }

Upvotes: 0

Quentin
Quentin

Reputation: 944432

Not really. You can't guarantee that there won't be an overriding rule that has a more specific selector and has !important.

You also need to specify the value explicitly. initial is not the same as the value from the UA stylesheet.

You could loop over all the elements with JS and set inline style on them, but again, some other code could interfere with your JS.

(NB: Your syntax is SCSS and not CSS).

Upvotes: 2

Related Questions