CODEWITHSUNDEEP
javascripthtmlcssiframe
DuckQueen
DuckQueen

Reputation: 802

How to get a level of isolation for div similar to one iframe provides?

So I have a project with page.html that has JS and CSS that can conflict with my main.html. I want to embed page.html contents into main.html without corrupting main.html logic. iframe currently does it for me yet I want to have elements from main.html sometimes hover over it and here is where I get to the problem with iframe approach. So I want to have isolated div is it possible?

Upvotes: 0

Views: 104

Answers (1)

Avinash Srivastava
Avinash Srivastava

Reputation: 31

You’ll need to apply all: initial to your div and all: unset to its descendants.

#targetDiv {
  all: initial; /* blocking inheritance for all properties */
}
#targetDiv * {
  all: unset; /* allowing inheritance within #mydiv */
}

Upvotes: 1

Related Questions