0

I am making an A/B website. Mostly for fun. It has two parts. It fetches a page from the internet and shows it in a container (div#page). So I fetch example.com, and change the base and show it in the div. so far so good.

The uppper part is my site's content(div#header). I show the menu, a form(to specify url) and a couple of other things.

The problem is: the css from example.com also applies to the elements of my site. How do I stop this from happening? I want example.com's css to apply only to #page, not #header

Is there a way of doing this? I know I can use a reset helper, but doesn't seem like an optimal solution: having to redefine everything. Plus then my site's css will apply to example.com

Any ideas, or is this undoable?

SoWhat
  • 5,564
  • 2
  • 28
  • 59

2 Answers2

2

Isolate the example.com to an iframe. To interact with the javascript on that page, then follow this answer

Community
  • 1
  • 1
driangle
  • 11,601
  • 5
  • 47
  • 54
1

You can try and isolate all your styles from placing a more specific selector in the front of all your selectors in your .css.

So if had a bunch of style selectors:

.main{ ... }
#myContainer { ... }
#menu .menu-item { ... }
p { ... }

(or what-ever it might be)

Then put an id on your top-most element in your HTML (eg BODY element), something like 'myPage', then change all your css selectors to this:

#myPage .main{ ... }
#myPage #myContainer { ... }
#myPage #menu .menu-item { ... }
#myPage p { ... }
JTech
  • 3,420
  • 7
  • 44
  • 51
  • sort of what I was trying to avoid. I wanted styles to only propogate to after the point where they were declared. The previous elements should not be affected. but can't do that, I suppose – SoWhat Feb 08 '12 at 04:43
  • can you explain this statement further (perhaps with an example): "only propogate to after the point where they were declared" – JTech Feb 08 '12 at 23:06
  • I meant if i declare styles on line 89 and there are matching elements on line 80, they should not apply to the elements on line 80 – SoWhat Feb 13 '12 at 09:26