How to isolate CSS styles to one area?

[kdjuiopo]

I have ran into the issue of conflicting CSS styling a few times now and would like to know if there is any way other than an iframe to isolate the css styling to one area of the web page without that css affecting other areas of the page.

For example you have a html & css code provided by a third party for a search or sale box to be embedded into your webpage but their css conflicts with your pages css. You could use an iframe but the search box has drop down menus that would be cut off after the iframe area, etc. etc.

Is there any way to build a designated area of the page which keeps the CSS in that area separate from all other areas of the page, i.e. your main pages stylesheet?

[rajmv]

You could add all your own content under a <div id="myContent"> and then use css rules that read like:
#myContent .myClassIWantToCSS {
color : green;
}

Or you can just not name your classnames and IDs so genericly that it conflicts with other css.