8 replies to this topic

[laurenp]

Hi There,

I have used the following CSS to override the default pagelne buttons style. It works fine in Firefox but in IE and Chrome the background colour doesn't show and I just see the gradient. What am I missing?

This pic shows what the button looks like in IE (top) and firefox (bottom)


input[type="submit"], .submit, input[type="button"], .button, input[type="reset"], .reset {
-moz-box-sizing: content-box;
background: #D22328 !important;
border:none !important;
border-radius: 3px 3px 3px 3px;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
color: #FFFFFF !important;
cursor: pointer;
padding: 4px 9px;
text-decoration: none;
text-shadow: none !important;
text-transform: uppercase;
font-size: 13px;
font-weight: bold;

}

input[type="submit"]:hover, .submit:hover, input[type="button"]:hover, .button:hover, a.button:hover, input[type="reset"]:hover, .reset:hover {
background: #b72525;
}

Cheers!

[Rob]

Lauren, this may or may not work, but worth a simple try. Change background: to background-color: and see if that works. Since the site isn't live, I can't test it for you.

[laurenp]

Thanks but it didn't work. Sorry. If you want to take a look with firebug then you can try this page (right down the bottom).

Please Login or Register to see this Hidden Content

[Rob]

Try this:

Please Login or Register to see this Hidden Content

[Rob]

That worked for me in Firebug.

[laurenp]

Isn't that code to make it look like the top button? That's the one that isn't working - it should look like the bottom example - the solid red with no gradient. Cheers!

[Danny]

Hi LaurenP, I added your custom CSS and the button works for me in all browsers that I am able to test Chrome, Safari and FF. Unfortunately, I am unable to test IE correctly, therefore can you take a screenshot of the button in IE with the CSS that is loading using Internet Explorer's inspection tool please.

[stephwise]

Hey!  I'm having the same issue + was wondering if anyone ever found a solution.  My client uses IE so she keeps commenting on the submit buttons looking too grey (with the gradient).  Here is the website:

 

www.christinamillerdesigns.com

 

Also, I just started using browserstack today, but am not sure how to fix the problem. (at least i can see it now).

[Danny]

Hi,

 

Can you create your own topic please.