jq beginner
jq beginner

Reputation: 1070

css3pie applies effects to divs not input text

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

Answers (1)

Spudley
Spudley

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

Related Questions