1

1

How can I style a form button or .net control button if I don't have access to the code to insert an image?

flag

1 Answer

0

To style an input button like you see in html forms, attach an id or class to it. (This method also works for .net button controls.)

.submit-button
{
     background: url(../images/submit-button.png) 0 0 no-repeat;  
     border: 0;                                                  
     display: block; 
     font: 0/0 Arial;                                                                      
     height: 30px;
     text-indent: -1000px;
     width: 80px;
}

This line will apply your button image to the element.

background: url(../images/submit-button.png) 0 0 no-repeat;

This line removes the input field's border.

border: 0;

These lines get rid of the button's text. Text-indent: -1000px suffices for all browsers except IE, which requires the font declaration. The font declaration can also be lengthened to font-size: 0; line-height: 0;, the family declaration is not necessary, but I write it this way so that I can use the short-form version

font: 0/0 Arial; 
text-indent: -1000px;

These lines define your button's dimensions.

height: 30px;  
width: 80px;
link|flag

Your Answer

Not the answer you're looking for? Browse other questions tagged or ask your own question.