Question

I have a little CSS code as below:

input{
    background-image:url(css_img/input_bg.gif);
    padding:6px;
    margin:1px;
    width:250px;
    font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
    font-size:12px;
    font-weight:bold;
    font-variant:normal;
    height:30px;
    -moz-border-radius:3px 3px 3px 3px;
    -moz-box-shadow:0 2px 3px #DDDDDD;
    border:1px solid #aaa;
    color:#333333;
}

But this code changes the style of all the <input type="..."/> tags. How can I change the style of just text fields <input type="text" name="name" />? I don’t want to have to add classes to them.

Also is there any way to round the corner just using plain CSS (not using image) which diplays well in Internet Explorer.

Please help me…

Answer 1

Use an attribute selector:

input[type="text"] {
    /* styles here */
}