0

My Razor component populates a number of divs to a container.

Is it possible to inherit the table-stripe color and apply it to my divs (odd) rather than overriding it?

Or, if I declared a new CSS class "Div-Stripe-Row".

Is it possible to reference the background-color from Bootstrap's table-striped background-color (use what's already there) rather than declaring a new color (overriding it by just copying what the color is)?

Christian
  • 4,902
  • 4
  • 24
  • 42
pizzaboy
  • 21
  • 4

2 Answers2

1

Your question may be a duplicate of this one.

Unless you want to use LESS, I would recommend adding a class to those divs and copy the styles of the Razor component to that class.

Genevieve McAllister
  • 116
  • 1
  • 10
  • I wanted to avoid overriding the attributes (creating a completely new class with separate colors), as at some point I might want to change themes and wouldn't want to go through every where I'm adding changes. Is there a way to create a new class and inherit the background-color thats used by Bootstrap defined table-stripe class? – pizzaboy Mar 29 '22 at 22:27
  • 1
    Read over the question I linked to, but in short, no, you can't inherit classes with CSS. – Genevieve McAllister Mar 29 '22 at 23:03
0

Unfortunately, CSS does not provide 'inheritance' in the way that programming languages like C++, C#, or Java do. You can't declare a CSS class and then extend it with another CSS class.

However, you can apply more than a single class to a tag in your markup ... in which case there is a sophisticated set of rules that determine which actual styles will get applied by the browser.

See https://stackoverflow.com/a/1065476/3842598

The accepted answer says:

There are tools like LESS, which allow you to compose CSS at a higher level of abstraction similar to what you describe.

Less calls these "Mixins"
...

See https://stackoverflow.com/a/1065476/3842598

Christian
  • 4,902
  • 4
  • 24
  • 42
  • Thanks @Christian, a very precise answer to what I was looking for. A little out of scope of this post, but can you tell me what the inherit keyword in CSS actually does? I do recall seeing it back when Bootstrap wasn't as popular. – pizzaboy Mar 30 '22 at 01:26
  • Do you mean this? https://developer.mozilla.org/en-US/docs/Web/CSS/inherit – Christian Mar 30 '22 at 14:49