jquery ui - css framework for an app with existing stylesheet

Question

I am building a chrome extension that attaches a widget sort of thing to gmail message. It appears below every email (something like a gmail contextual gadget) when the user is on gmail.com site.

I looked at few css frameworks like twitter bootstrap to use in my app. When I used it in mywidget, it messed with the existing gmail styles because of css class name clash. Is there any other framework that I can use where there would be no name clash? I came across jquery-ui framework. All the classnames here start with .ui-* thereby causing no name clash. Are there any other css frameworks like this with unique class names?

Answer 1

Update 2: Here is a gist of v3.1.1 provided by @GFoley83

Update: The pastebin joined below is the Twitter Bootstrap version 2.0.4

You should definitively use the up-to-date version and compile it yourself.

---

Here is what I did with the bootstrap less files :

.tw-bs {
    @import "less/bootstrap.less";
}

And this is the result : http://pastebin.com/vXgRNDSZ

Demo (jsfiddle)

If you don't like tw-bs you can easily do a find/replace, there shouldn't be any conflict.