Jump to content


Photo
- - - - -

CSS classes being overridded


  • Please log in to reply
5 replies to this topic

#1 LukeB

LukeB

    Super Member

  • Members
  • 139 posts
  • Framework Version:2.4.1
  • Country: Country Flag

Posted 21 December 2011 - 03:42 PM

Hi im trying to set some custom css classes for different instances of the Special recent posts pro widget, however they seem to keep being ignored. Either that or im not doing it correctly. These are the instructions from the widget Additional CSS Classes Enter a space separated list of additional css classes for this widget instance. So ive entered {font-size:95%} But it seems to have no effect, ive tried various combinations of css classes but i cant seem to figure it out. Any clues as to what im doing wrong

Please Login or Register to see this Hidden Content



#2 Jenny

Jenny

    Advocate

  • Unicorn Store Dev

  • 2924 posts
  • LocationWV
  • Country: Country Flag

Posted 21 December 2011 - 05:23 PM

I don't even see the plugin's stylesheet being loaded so make sure you don't have to check a box to enable it or something. Does it say to use the brackets? If it provided example formatting, please let us know what it is. Otherwise, you may try adding a ; after the %.

#3 LukeB

LukeB

    Super Member

  • Members
  • 139 posts
  • Framework Version:2.4.1
  • Country: Country Flag

Posted 21 December 2011 - 05:59 PM

There appears to be an option to select Disable Plugin CSS "This option enables/disables the built-in widget stylesheet. Set this option to "Yes" if you wish to use your own style." However this removes all formatting and all i really want to do is add/alter one of the existing rules

#4 kastelic

kastelic

    Advocate

  • Members

  • 3081 posts
  • Country: Country Flag

Posted 21 December 2011 - 10:27 PM

Have you tried !important ? Adding it after any rule tells CSS to ignore the cascade and make that rule override others above it, like this: {font-size:95% !important}

#5 suzyo

suzyo

    Super Member

  • Members
  • 105 posts
  • Country: Country Flag

Posted 11 July 2013 - 06:33 AM

I've figured it out. 

 

In the backend of the SRP widget that you want to customize, you will see 2 fields, one for "Widget CSS ID", and another for "Additional CSS Classes".

 

In the image attached you will see that I have named the ID "homepageInstance". You don't enter the hashmark here, just the name.

 

Then, in your CSS, define #homepageInstance. In this case, it's '#homepageInstance {margin-top:3em;}' and I have a top-margin of 3em on the SRP widget on my homepage, other SRP widgets are not affected.

 

The tricky part is that nowhere in the documentation does it tell you to leave the  '#' or the '.' out of the field.

 

Please Login or Register to see this Hidden Content


 



#6 Rob

Rob

    One Smart Egg

  • Members
  • 13575 posts
  • LocationEast Coast, USA
  • Framework Version:The Latest, of course
  • Country: Country Flag

Posted 11 July 2013 - 04:24 PM

Suzy,

 

While this input is deeply appreciated, please note that we don't provide documentation, support or resources for third-party plugins here, and most assuredly not on an outdated, nearly 2 year old forum topic. 

 

Anytime any plugin or component of WordPress or PageLines asks for a Class or ID field, you're only supposed to enter the word, without spaces or breaks, not prefacing indicators like a period or hash.