[Solved] text on image center and responsive

Question

As G.L.P’s comment suggets you can use CSS gradients to get the background working.

For the “Responsive web” button you could look into setting the width in a % value, this scales to relatively to the webpage.

Here’s a nice explanation as to what to use, and when to use it

Try something like this:

HTML:

 <button>Submit</button>

CSS:

button {
    width:30%;
    background: -webkit-linear-gradient(grey, white); /* For Safari 5.1 to 6.0 */
    background: -moz-linear-gradient(grey, white);/* For Opera 11.1 to 12.0 */
    background: -o-linear-gradient(grey, white);/* For Firefox 3.6 to 15 */ 
    background: linear-gradient(grey, white); /* Standard syntax */
}

See the fiddle to see this code in action

Accepted Answer