CODEWITHSUNDEEP
jqueryhtmlcss
Hirvesh
Hirvesh

Reputation: 7982

JQuery Plugin Stylesheet

I've got a jquery plugin which comes with its own stylesheet. However, when I include my own stylesheet along with that of the plugin, the plugin stylesheet always gets affected by the css in my own stylesheet.

Is there a way to prevent this?

Upvotes: 1

Views: 159

Answers (1)

Alexey Lebedev
Alexey Lebedev

Reputation: 12197

There's no quick fix. You either have to resolve conflicting styles by hand, or prefix every style in plugin's CSS with some class name, e.g.

.plugin-x h1 { ... }
.plugin-x li { ... }
.plugin-x .info { ... }

And then wrap HTML element your plugin generates in a div with that special class name:

  <div class="plugin-x"><!-- html generated by the plugin here --></div>

In the case when your own global styles affect the plugin styling, e.g. links become red, you'll have to add this style:

.plugin-x a { color: black }

Or simply edit plugin's stylesheet and specify the color you want.

Upvotes: 4

Related Questions