PDA

View Full Version : css form label IE9 problem


tahsin1982
11-19-2011, 04:08 PM
Hi guys,

I am completely stumped at this.
http://tahsinwonders.net/blog/?p=23#more-23

This is a wordpress blog which I created from scratch. The leave a reply label section looks perfect in all browsers and for some reason not in Ie9 even Ie8 it looks great. I am not sure what I did wrong I am just lost and would be very greatful if someone can tell me if there is something I did wrong that is causing this label to look messed up in IE9.

here is my css for the form area.

/********************COMMENTS********************** */
#comments_template {
font-size:12px;
color:#ccc;
background-image: url(images/blogShadow.png);
background-position: center bottom;
background-repeat: no-repeat;



}

#comments_template input {

width:260px;
font-size:12px;
padding:10px;
margin-bottom:10px;
background-color:#c8c8c8;
margin-right:10px;
border:none;

}



#comments_template input:focus, #comments_template input:hover,
#comments_template textarea:focus, #comments_template textarea:hover

{

background:#fff;


}



#comments_template input#submit{

width:100px;
background:#666666;
color:#fff;
border-top:solid 1px #fff;
height:30px;
padding:0;
margin:0;
}




#comments_template input#submit:focus, #comments_template input#submit:hover

{

background:#808080;
cursor:pointer;


}


#comments_template textarea{

background-color:#c8c8c8;
width:580px;
border:none;
padding:10px;
margin-bottom:15px;


}

tahsin1982
11-19-2011, 06:11 PM
Ok managed to fix it. the problem was because wordpress generated the form with size=22 in the input tags and this was causing it to get messed up with the css in IE9 after removing it everything is back to normal.

but in Ie7 the problem is there but I can live with that.