Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

For some reason, I can't add a PayPal donate button to the sidebar of my website. I've been using CSS to create a rollover effect, and while it's worked on a static page of my site: http://kellygreenproject.com/volunteer-2, the same method doesn't appear to work in the top widget on the right sidebar of the site.

CSS:

a.paypalButton {
    display: block;
    width: 207px;
    height: 44px;
    background-image: url('http://kellygreenproject.com/wp-content/uploads/2013/05/General-Donate.png');
}

a.paypalButton:hover {
    background-position: bottom left;
}

HTML:

<a class="paypalButton" href="https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=YJFFMF5R5TJ9J"> </a>

I even added the button to the bottom of the volunteer page (http://kellygreenproject.com/volunteer-2) and it works there, but just doesn't show up in the sidebar. If I write text between the a tag it places the button as a background, but that's definitely not what I want to do.

share|improve this question

closed as off topic by toscho May 18 '13 at 9:30

Questions on WordPress Development Stack Exchange are expected to relate to WordPress within the scope defined by the community. Consider editing the question or leaving comments for improvement if you believe the question can be reworded to fit within the scope. Read more about reopening questions here.If this question can be reworded to fit the rules in the help center, please edit the question.

1 Answer 1

up vote 0 down vote accepted

solution for your problem

1.This css code conflict with your css ( for paypal button )

#widgets .textwidget a {
display: inline;
}

and

#widgets a {
display: inline-block;
margin: 0;
padding: 0;
text-decoration: none;
}

2.put !important in display property

a.paypalButton {
        display: block!important;
        width: 207px;
        height: 44px;
        background-image: url('http://kellygreenproject.com/wp-content/uploads/2013/05/General-Donate.png');
}
share|improve this answer
    
Thanks so much Ravs! I'm assuming the !important declaration overrides the widget CSS? It works great. –  user32994 May 18 '13 at 7:31

Not the answer you're looking for? Browse other questions tagged or ask your own question.