0

In my HTML file I'm linking a CSS file from bootstrap. This CSS file contains a lot of markup for a lot of different classes. I also have a custom CSS file linked after the bootstrap file in my HTML <head>. I now find myself in a situation where a custom class of mine has the same name as a class from the bootstrap CSS file, resulting in unwanted markup from the bootstrap file. Is it possible to completely overwrite this class, so that it only has the properties I specify in the custom class? I read here that it's not possible, but the last activity on this post was in 2017. Something like all: initial doesn't work too well because it also resets font and stuff like that.

Tom
  • 4,972
  • 3
  • 10
  • 28
Egelbets
  • 175
  • 2
  • 11
  • 1
    "I now find myself in a situation where a custom class of mine has the same name as a class from the bootstrap CSS file" - why not just rename your CSS class? – Dai Dec 28 '21 at 13:51
  • It's an option but I don't like heaving to add something like `my-` in front of every class that's affected by this – Egelbets Dec 28 '21 at 13:53
  • With Bootstrap CDN version, not possible. You will have to rename your classes. If you're using SASS version, you can remove the classes (https://getbootstrap.com/docs/5.0/utilities/api/#remove-utilities). – Siddharth Bhansali Dec 28 '21 at 13:56
  • 1
    Better idea: don't use Bootstrap? I'm not a fan of CSS _starter packs_, I like to go my _own way_ instead of making a website that looks like everything else out there. As [Annie Lennox](https://www.youtube.com/watch?v=drGx7JkFSp4) once said, _" CSSisters are doing it for themselves"_ – Dai Dec 28 '21 at 14:00

0 Answers0