Padding value in submit button

Question

I would like to add a padding to the value of a submit button.

I am able to do for example text-align: right; and the value floats well right. But if i use for example padding-left: 25px; the value itself stays in the middle instead of moving 25px to the right. I found a lot of things about centering the Value but never to add a padding to it.

Example css code:

.sign {width: 262px;height: 102px;float: right;background: url("../images/sign.png") no-repeat scroll 0 0 transparent;margin: 25px 0px 0px 0px;border: none;display: block;}
.sign:hover {background: url("../images/signhover.png");border: none;}

What to put in the above code to change the place of only my Value?

Answer 1

Try adding text-align: left;

.sign {width: 262px;height: 102px;float: right;background: url("../images/sign.png") no-repeat scroll 0 0 transparent;margin: 25px 0px 0px 0px;border: none;display: block;padding: 0 0 0 25px;text-align: left;}
.sign:hover {background:  url("../images/signhover.png");border: none;}

I created an example on jsfiddle .

Answer 2

Add

 padding-left:50px; text-align:left

From the example you provided: http://jsfiddle.net/ajy5q/