Hide borders for an input box

I wanted to have a form with read only input boxes that were populated by Ajax calls. The problem is there was a border around the box in IE7 and FF 3.5. In IE6 border=0 solved the issue but not in the other browsers. Thanks to this site for the inspiration I was able to remove the borders using this css style:

.hiddenlabel[type="text"] 
{
border:none;
display:inline;
vertical-align:middle;
}

The key is the [type=”text”], this applies the style to the input box. Just in case your wondering why I need to do this it is because I need the information in the form to be submitted and need to update the information using Ajax. This was easier than using hidden fields.

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s