How do I limit Bootstrap to just the scope of a div? I need to nest the Bootstrap stylesheet inside an ExtJS app for especific divs and both are clashing since they need their own body, ul, li, a, etc.
I'm trying to avoid editing bootstrap.css manually (or keeping it to a minimum) so that it can be easily updated.
use custom class name for div in which u dont want to use bootstrap.... As bootstrap apply js and css to only standard pre-defined names....and most important dont forget to use external . css and . js file to override styles and scripts for global tags which are defined in bootstrap plugin such as h,a etc....
You can fork the bootstrap repo and change bootstrap.less
to wrap the bootstrap styles:
.bootstrap-scope { //put bootstrap @includes in here }
Then, in the root of the bootstrap project, run make
to generate the bootstrap.css
file.
You'll lose the global styles bootstrap assigns to the body and html tags, but you might not want them anyway.
And then, in your app, give the container you want the .bootstrap-scope
class.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With