Title: Blue button code not working Last modified: August 21, 2016 --- # Blue button code not working * [Smita12481](https://wordpress.org/support/users/smita12481/) * (@smita12481) * [12 years, 7 months ago](https://wordpress.org/support/topic/blue-button-code-not-working/) * I am using the responsive theme and initially successfully changed the color of the blue button on the home page by using the following code in the CSS style under theme options. * a.blue { background-color: #606788; background-image: -moz-linear-gradient(center top , #6B7398, #606788); border: 1px solid #555C79; color: #FFFFFF; text-shadow: 0 -1px 0 #555C79; } * a.blue:hover { background-color: #888fac; background-image: -webkit-gradient( linear, left top, left bottom, from(#888fac), to(#606788)); background-image:- webkit-linear-gradient(top, #888fac, #606788); background-image: -moz-linear- gradient(top, #888fac, #606788); background-image: -ms-linear-gradient(top, # 888fac, #606788); background-image: -o-linear-gradient(top, #888fac, #606788); background-image: linear-gradient(top, #888fac, #606788); border: 1px solid # 115290; color: #ffffff; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr =#888fac, endColorstr=#606788); text-shadow: 0 -1px 0 #555C79; } * For some reason, after returning to the site, the button is blue, but the hover colors are correct. Please help! [http://www.thefertilityadvisor.com](http://www.thefertilityadvisor.com) Viewing 5 replies - 1 through 5 (of 5 total) * [LauraHartwigDesign](https://wordpress.org/support/users/laurahartwigdesign/) * (@laurahartwigdesign) * [12 years, 7 months ago](https://wordpress.org/support/topic/blue-button-code-not-working/#post-4269468) * Did you mean the hover colors are incorrect? They look good to me. Did you figure this out? If not, let me know what you were looking for so I can help you. If all is good, please mark as resolved. Thanks! * Thread Starter [Smita12481](https://wordpress.org/support/users/smita12481/) * (@smita12481) * [12 years, 7 months ago](https://wordpress.org/support/topic/blue-button-code-not-working/#post-4269505) * Thanks for your response. What I realized is that the button color looks correct in Mozilla but not in google chrome or safari. Do you know how I can fix this so it looks the same across platforms? * I would like the button color to be a shade of purple to match my site (not the standard blue). On all platforms, the hover color is the correct purple color. Thank you! * [LauraHartwigDesign](https://wordpress.org/support/users/laurahartwigdesign/) * (@laurahartwigdesign) * [12 years, 7 months ago](https://wordpress.org/support/topic/blue-button-code-not-working/#post-4269524) * Have you tried this site: [http://www.cssbuttongenerator.com/](http://www.cssbuttongenerator.com/)? It will generate all the code for you and it will work cross browser. * [Jitendra Mishra](https://wordpress.org/support/users/jitendra-mishra/) * (@jitendra-mishra) * [12 years, 5 months ago](https://wordpress.org/support/topic/blue-button-code-not-working/#post-4269650) * Sorry, we do not monitor these forums, please use the official forum: * [http://cyberchimps.com/forum/](http://cyberchimps.com/forum/) * Thanks * [David Burkhart](https://wordpress.org/support/users/dlburkhart/) * (@dlburkhart) * [12 years, 4 months ago](https://wordpress.org/support/topic/blue-button-code-not-working/#post-4269654) * I don’t know anything about the particulars of cross-browser hacks for background- image, but it seems to me by looking at your code that this should do the trick: * ``` a.blue { background-color: #606788; background-image: -webkit-gradient(linear, left top, left bottom, from(#6B7398), to(#606788)); background-image: -webkit-linear-gradient(top, #6B7398, #606788); background-image: -moz-linear-gradient(top, #6B7398, #606788); background-image: -ms-linear-gradient(top, #6B7398, #606788); background-image: -o-linear-gradient(top, #6B7398, #606788); background-image: linear-gradient(top, #6B7398, #606788); border: 1px solid #555C79; color: #FFFFFF; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#6B7398, endColorstr=#606788); text-shadow: 0 -1px 0 #555C79; } a.blue:hover { background-color: #888fac; background-image: -webkit-gradient(linear, left top, left bottom, from(#888fac), to(#606788)); background-image: -webkit-linear-gradient(top, #888fac, #606788); background-image: -moz-linear-gradient(top, #888fac, #606788); background-image: -ms-linear-gradient(top, #888fac, #606788); background-image: -o-linear-gradient(top, #888fac, #606788); background-image: linear-gradient(top, #888fac, #606788); border: 1px solid #115290; color: #ffffff; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#888fac, endColorstr=#606788); text-shadow: 0 -1px 0 #555C79; } ``` Viewing 5 replies - 1 through 5 (of 5 total) The topic ‘Blue button code not working’ is closed to new replies. * ![](https://i0.wp.com/themes.svn.wordpress.org/responsive/6.3.7/screenshot.png) * Responsive * [Support Threads](https://wordpress.org/support/theme/responsive/) * [Active Topics](https://wordpress.org/support/theme/responsive/active/) * [Unresolved Topics](https://wordpress.org/support/theme/responsive/unresolved/) * [Reviews](https://wordpress.org/support/theme/responsive/reviews/) * 5 replies * 4 participants * Last reply from: [David Burkhart](https://wordpress.org/support/users/dlburkhart/) * Last activity: [12 years, 4 months ago](https://wordpress.org/support/topic/blue-button-code-not-working/#post-4269654) * Status: not resolved