Reputation: 1070
i'm using css3pie (for internet explorer 8) to apply effects like border radius to divs on my page it works but not on input text
.header input[type="text"]{
border: 2px solid #696;
text-align: center;
width: 150px;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
background: #fff;
box-shadow:5px 5px 5px #000;
-webkit-box-shadow:5px 5px 5px #000;
-moz-box-shadow:5px 5px 5px #000;
behavior: url(PIE.htc);
}
and here's the head code
<link rel="stylesheet" type="text/css" href="main.css">
<!--[if IE 8]>
<link rel="stylesheet" type="text/css" href="ie.css">
<![endif]-->
<meta http-equiv="X-UA-Compatible" content="IE=8" />
any advice please ?
Upvotes: 0
Views: 736
Reputation: 168803
There shouldn't be a problem with input
elements in CSS3Pie, provided you're using px
measurements, which you are; the docs mention problems with proportional sized elements in the known issues page, but that isn't your issue.
Given that you've got other elements in the same page working, there are only other likely issues:
First is the hasLayout
issue. The resolution to that is generally to add something like zoom:1
to the styles.
Second is the disappearing borders issues, for which the solution is to work with the position
and z-index
styles.
Both these issues are discussed on the CSS3Pie known issues page, along with details of how to resolve them.
Upvotes: 2