Need help with escaping inherited css

0E800

I am working on custom css for BBCode extension. How do I get my class to escape out of an inherited class?

.Post-body a {
    text-decoration:none;
  border-bottom: 1px solid #ce8483;
  box-shadow: inset 0 -1px 0 #ce8483;
  color: #ce8483;
  transition: background 0.1s cubic-bezier(.33,.66,.66,1);
}

.Post-body a:hover {
  background: rgba(206, 132, 131, .8);
color: black;
}

So my BBCode is within the <div class=Post-body> but I do not want it to inherit the link hover effects (above code) that belong to the post-body class.

Any guidance would be greatly appreciated.

Kyrne

0E800 might want to touch up on your CSS ? use !important;

Ex: margin: auto !important;

0E800

Kyrne
Brush up? Shoot I've been flying by the seat of my pants since day 1.

I've used the !important maybe I'm just not putting next the the correct spot.

Thanks again man.

Kyrne

0E800 cushhh this is your uhhhhhh copilot speaking, uhhhhhhhhhhh we going through some turbulence, fasten your seat belts

0E800

So it wasn't that I needed !important, it was that I needed to include class items that were inherited, and set them to transparent.

So I created :

.specialclass a {
border-bottom: none;
  box-shadow: transparent;
  color: transparent;
}
.specialclass a:hover {
background: transparent; 
}

It had the effect of canceling out the post-body hover effects just for my special class.

Thanks again for your reply.

Kyrne

0E800 great!

FYI, I can be reached much faster on gitter/Discord. Feel free go dm or talking in the Flarum one.