0

I have to integrate some web objects through an API in a Bootstrap based site. Meaning my objects come with their CSS and are encapsulated in "Bootstrap elements". I have tried to prefix Bootstrap with less (.boot-scope) but, because my objects are encapsulated in Bootstrap nodes, the cascading mechanism makes Bootstrap style to be applied on my objects also (at least the overlap). Scoping Bootstrap for a site subset using only Bootstrap works well, but my situation is the opposite: I want to exclude some elements that are inside Bootstrap elements. I've found some inelegant solutions (like flagging all "non api" objects and prefixing Bootstrap with .nonapi >.) Has someone found a consistent solution to exclude elements from Bootstrap styling when those elements sit inside Bootstrap nodes?

raukodraug
  • 11,519
  • 4
  • 35
  • 37
user3844138
  • 1

1 Answers1

0

Make a custom.css file and include it after all the bootstrap files. That should overwrite the styles from the bootstrap API

Caweren
  • 236
  • 1
  • 9
  • Thanks Caweren, as far as I understand, loading order just affect if the style weight is the same. If my bootstrap add for example a margin on .myclass and margin is not defined in my custom.css then the margin is applied :-( – user3844138 Jul 16 '14 at 09:13
  • @user3844138 Isn't that always the case, regardless of using Bootstrap or any other CSS framework? – Pieter VDE Jul 16 '14 at 09:15
  • See this answer [stackoverflow](http://stackoverflow.com/questions/15901030/reset-remove-css-styles-for-element-only) for a complete explanation – Caweren Jul 16 '14 at 09:15
  • @Dreamonic, yes you're right, it is not specific to BS – user3844138 Jul 16 '14 at 09:17
  • @Caweren, understand the reset but it doesn't really help in my situation. Regarding a potential solution: I can recompile my bootstrap but can't touch css coming from the "API objects", I can tag top level div's containing API objects. – user3844138 Jul 16 '14 at 09:36