How to make one css input type be displayed the same as another input type

I'm using a special input type for the iPhone mobile safari browser:

<li><textarea placeholder="Store Description" ></textarea></li>
<li><input class="input['text']" type="tel" name="name" placeholder="Store Phone Number" id="some_name" /></li>

The problem is that the framework I'm using has CSS styles associated with inputs that have type="text". When I switch to type="tel" it displays incorrectly. I would like to make the input use开发者_开发知识库 the same class without considering the type of input. Is there a way to do this?

You'll need to copy the CSS for input['text'] and put it in a class of your own. Then you need to apply that class to your textbox. Keep in mind about targeting the style. Most probably your style will need to be targeted with an extra selector to override the styles defined for the input['text']

CSS targeting : http://htmldog.com/guides/cssadvanced/specificity/

Is there any reason you can't modify the css?

input[type="text"], input[type="tel"] { /* style */ }

In your CSS, select both input types:

input[type=text], input[type=tel]{ //CSS style in here
}