html - In mozilla my button not look good as it shown in chrome -
I want to show my button in Mozilla like Chrome, please help me, what should I do for it? This is my code.
CSS:
.green {background: linear-gradient (bottom, # 9CD645 0%, # 8AC530 100%) repeat scroll 0 0 RGBA (0, 0, 0, 0); Border: 1px solid # 82b436; }. Large size {font size: 18px; } .btn {boundary: 1px solid # 82b436; Range radius: 25px; Box-Shadow: 0 1 Px RGBA (99, 15, 8, 0.35); Color: # 508400; Display: Inline-block; font-weight: bold; Padding: 3px 12px; Text-decoration: None; Text-transform: uppercase; } .Green {background-color: # 8CC63F; } .btn span {background: url ("images / icon_arrows.png") No-repeat scrolls 0 RGBA (0, 0, 0, 0); Display area; float right; Height: 18px; Margin: 5 px; Width: 18px; }
HTML:
& lt; A href = "smoodees" class = "btn big green" & gt; Our Smoodees & lt; Span & gt; & Lt; / Span & gt; View & lt; / A & gt;
Check this Bela:
http : / / Jsfiddle.net/realdeepak/gvC9z/1/
Or for browser compatibility in the browser, you can use CSS hack like this:
@ - stockings -document url-prefix () {. Large (font-size: 17px;}} or try it out, and fix minor CSS padding alignment according to your screen: & lt; Repeat Scroll 0 0 RGBA (0, 0, 0, 0); Border: line type = "text / css"> Green {background: linear-gradient (bottom, # 9 cd 645 0%, # 8AC530 100%) 1 px solid # 82b 436;} larger size {font size: 18px;} .btn {boundary: 1 px solid # 82b436; boundary-radius: 25px; box-shadow: 0 1 px rgba (99, 15 9, 8, 0.35); Color: # 508400; Display: Inline-block; f Thick thickness: bold; padding: 3px 30px 3px 10px; text-decoration: none; text-transform: uppercase; position: relative;}. Green {background-color: # 8CC63F;} .btn span {background: url "Images / icon_arrows.png") No-repeat scrolls 0 RGBA (0, 0, 0, 0); height: 18px; margin: 5 px; width: 18px; position: full; top: 0; right: 0; } & Lt; / style & gt;
Comments
Post a Comment