Home/ Questions/Q 7081809
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-28T06:58:03+00:00

We are using twitter bootstrap to do some redesign of our site. The issue

  • 0

We are using twitter bootstrap to do some redesign of our site.

The issue we have is that the part of the site we are redesigning is that this part shows content that the user is able to enter themselves including html tags .eg etc that they may have defined their own styles for.

The problem with this is that the bootstrap stylesheet would overwrite the user stylesheet or vice versa.

Is there a way to scope the stylesheet to a particular class (ie twitter stylesheet only applies to elements inside a div with class = “twitter” or something similar) without it affecting the user stylesheet and without having to modify all of the twitter classes to include a more specific selector.

We have considered using an iframe but we really need good control over the user content to be able to send/receive from it pretty easily, ie. ajax methods that trigger things on the rest of the page

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Using an iframe is the way to go.
    Here’s some examples of how to communicate with it and access it’s content.

    The iframe content can call a function in the parent like this:

    parent.yourFunction()

    The parent can call a function in the iframe like this:

    document.getElementById('iframeid').contentWindow.yourFunction();

    The parent can access the iframe’s html like this:

    document.getElementById('iframeid').innerHTML() = "<html><body><div>some content</div></body></html>";

    Not quite what you were hoping but it’s the only way to have css only apply to part of a page.

    • 0