LazyPeon
LazyPeon

Reputation: 339

Overwrite existing style with new style

Is there a way or operator in CSS to assign a new style to specific element? I don't want to change original style because it belongs to a plugin and changing it will change it on all my pages. However I want to change the position of the element on a specific web page.

I also can't call those styles in my html because that CSS file is used solely in jquery plugin, you only put class="slideshow" in html div and thats that. I can change that CSS file to suit my preferences, however I don't know how to change it for specific instances?

Upvotes: 1

Views: 141

Answers (4)

Kheema Pandey
Kheema Pandey

Reputation: 10265

In your scenario CSS specificity Rule will be helpful for you.

For example in your plugin you are using RED Font Color in class slideshow. Then in your another CSS file you can create a more specific Rule.

Check the Demo what I've posted above on comments section. Here is the direct link.

div.slider .slideshow {color:green;}

Upvotes: 2

Sam Denton
Sam Denton

Reputation: 465

You can add !important to your css if you wish it to override any inline styles. So long as you make a style sheet specifically for that page, this should work for what you need. Hope this helps :)

Upvotes: 1

web-tiki
web-tiki

Reputation: 103750

In order to make a specific styling on a specific instance of your plugin, you should assign a specific class or id to a parent container of that plugin for the instance you need customization.

Example : you can give the id="special" to a parent of the plugin in the page you want customization.

Then you can use that selector to style it independently from other instances of that same plugin.

example CSS:

 #special .slideshow /*other selectors */ {
        /*your specific style */
    }

Upvotes: 2

Anthony Horne
Anthony Horne

Reputation: 2522

You can refer to the element by name:

#htmlitemname{
 color: green;
}

CSS is cascading, i.e. it will apply it top down - general, class and then the id.

Upvotes: 1

Related Questions