normally when I copy bootstrap css to a new file it copies over with all the same property settings.
I’m using the new “Startup Modern” template & trying to copy .btn class.
When I do copy it over most of the original properties aren’t set, background colors, font etc have changed.
Is this supposed to be like this & it’s the first time I’ve come across it or is it a bug?
When you copy the
.btn block, is the copied block the same as the originial (i.e. does it have the same rules and values)? This is what I get when I copy it:
If it’s the same for you, then copying isn’t the issue. What is happening though, is that all the CSS variables in the new
.btn block (
--bs-btn-* rules) are overriding the ones set by other blocks in Bootstrap. If you remove them, the button will look the same as it did before.
Bootstrap has started adding CSS variables to their components, which makes it easier to modify them. You just need to change the variable’s value:
Hope this helps!
Thanks for replying, yes you’re probably correct, I was a bit tired when doing this so will go through what you’ve pointed out more thoroughly & try & get my head into the game a bit better, thanks for the explanation.