Problems With CSS Gradient

theolonious

New Member
Hello, I'm Theo, owner of DollarTechCheck.

I'm using a CSS Gradient in the title bar of my website, and it looks fantastic in chrome. For whatever reason, it comes out horribly in Firefox. If you could take a look, it would be fantastic

DollarTechCheck.com

The code is below:

background-image: linear-gradient(bottom, rgb(122,122,122) 81%, rgb(173,173,173) 15%, rgb(133,133,133) 100%);
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
background-image: -o-linear-gradient(bottom, rgb(122,122,122) 81%, rgb(173,173,173) 15%, rgb(133,133,133) 100%);
background-image: -moz-linear-gradient(bottom, rgb(122,122,122) 81%, rgb(173,173,173) 15%, rgb(133,133,133) 100%);
background-image: -webkit-linear-gradient(bottom, rgb(122,122,122) 81%, rgb(173,173,173) 15%, rgb(133,133,133) 100%);
background-image: -ms-linear-gradient(bottom, rgb(122,122,122) 81%, rgb(173,173,173) 15%, rgb(133,133,133) 100%);

background-image: -webkit-gradient(
linear,
left bottom,
left top,
color-stop(0.81, rgb(122,122,122)),
color-stop(0.15, rgb(173,173,173)),
color-stop(1, rgb(133,133,133))
);
 

Nate55

New Member
I've had similar problems with gradients. In the end I decided to just use an image instead. I created a 1 pixel wide image in Photoshop with the gradient I wanted and just repeated o the x-axis for the header (this way obviosuly the image is only a tiny file size)
 
Top