How to preserve styles of embedded widget?

Question

How to make an external PHP widget page have its own CSS. The catch is - when the external page is included it\'s been affected by the stylesheet of th

Answer 1

If I understood correctly, your included page has some CSS rules such as:

div {/*rules*/};
p {/*rules*/};

and so on.

You should change your CSS selectors from the most general ones (div selects all the divs in the page) to the most particular ones (use them in this order: id, class, child-selector) in order for your rules to apply only to your included elements.

For example, say your included page is wrapped in a div, the PHP code would be:

Then, all your rules for the page should refer only to the children of the element with the id my_page:

Instead of

div {/*rules*/};

you'll have

#my_page div {/*rules*/};