This thread is over two years old and may be outdated. Please create a new thread if you need help, or email us if you have an active Premium license.

Can’t apply custom style to Call to Action widget

11 years ago · Last reply by Andrew Misplon 11 years ago

So I’ve been tinkering with the Call to Action and trying to customize my style. It looks great when I code it in the “inspect element” tool in the browser. I apply my changes in my child theme, refresh, and nothing. I looked closer and found that it’s injecting this inline style and overwriting my custom CSS:

.origin-widget.origin-widget-call-to-action-simple-light_dashed{zoom:1;padding:2em;position:relative;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;background:url(http://www.springgrovecounseling.net/wp-content/plugins/siteorigin-panels/widgets/img/textures/light-dashed.png) repeat #F6F6F6;-webkit-box-shadow:0 1px 2px rgba(0,0,0,0.1);-moz-box-shadow:0 1px 2px rgba(0,0,0,0.1);box-shadow:0 1px 2px rgba(0,0,0,0.1);border:1px solid #E0E0E0}.origin-widget.origin-widget-call-to-action-simple-light_dashed:before{content:'';display:block}.origin-widget.origin-widget-call-to-action-simple-light_dashed:after{content:'';display:table;clear:both}.origin-widget.origin-widget-call-to-action-simple-light_dashed .title{line-height:1.6em;margin:0;color:#333333;font-weight:auto}.origin-widget.origin-widget-call-to-action-simple-light_dashed .subtitle{line-height:1.25em;margin:0;color:#555555;font-weight:auto}.origin-widget.origin-widget-call-to-action-simple-light_dashed .origin-widget-button{position:absolute;display:block;top:50%;right:2em;margin-top:-22px}@media (max-width:680px){.origin-widget.origin-widget-call-to-action-simple-light_dashed .origin-widget-button{position:static;margin-top:2em}.origin-widget.origin-widget-call-to-action-simple-light_dashed .origin-widget-button a{display:block}}

How can I fix this so my custom CSS can be applied?

This is our free support forum. Replies can take several days.

Need fast email support? Get SiteOrigin Premium

Replies

2
  1. meaganbird 11 years, 10 months ago

    the code snippet didn’t show the tags. It’s in between tags.

  2. Andrew Misplon Staff 11 years, 10 months ago

    Hi Megan

    Here is CSS Tricks on the topic: http://css-tricks.com/override-inline-styles-with-css/.

    If you send through your customisation I can help format it for you if needs be.

Replies on this thread are closed.

Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Have a different question or issue?

Start New Thread