Question

I am making a naviagtion bar with a gradient as follows:

/* Gradient backgrounds for the buttons. Generated using http://gradients.glrzad.com/ */
background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0, #b49931), color-stop(0.5, #5E5E5E), color-stop(0.51, #707070), color-stop(1, #838383));
background-image: -moz-linear-gradient(center bottom, #787878 0%, #5E5E5E 50%, #707070 51%, #838383 100%);
background-color:#5f5f5f; /* Fallback */

it works great in safari but does not work firefox. I know making an image would be better but is there any easy way that it will work in firefox aswell as safari?

Answer 1

I have made a JSFiddle http://jsfiddle.net/BVbfQ/
You can use Safari to make a screenshot of the result and crop it to make a repeatable image.