Menu
I want to use twitter bootstrap for some site I am working on. This site requires a pre-set template to be used for certain parts of the page.
If I include the twitter bootstrap stylesheet it messes up the original template.
I want to include the external bootstrap.cc stylesheet but make it work only on tags which are a descendent of class="mycontent"
<html>
<link href="original stylsheet.css">
<link href="bootstrap.css">
...
...
<div class="header">
original stlesheet to be used here
</div>
<div class="mycontent">
bootstrap css to work for all descendents of my content
</div>
I know one way is to edit the css and add .mycontent before each and every tag. But I was wondering if there was a smarter solution
998
If scope attribute is present, then <style> applies only to its parent element.
<div>
<style scoped>
/* your css here */
<style>
<!-- content -->
</div>
It lacks of browser support, but there is a polyfill: jQuery Scoped CSS plugin.
Additional reading: Saving the Day with Scoped CSS.
Current browser support: http://caniuse.com/#feat=style-scoped
53
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
