CSS3 PIE - Non è possibile fornire il supporto per il raggio di confine IE?

Question

Sto cercando di creare angoli arrotondati in IE con il comportamento collegato a CSS3 PIE.

Ecco il mio CSS:

.fieldRow { 
    clear:both; 
    padding: 0; 
    margin: 0; 
    overflow: hidden; 
    line-height:17px; 
} 
.alternate, .rowMousedOver { 
    -moz-border-radius: 10px; 
    -webkit-border-radius: 10px; 
    border-radius: 10px; 
    behavior: url(PIE.php); 
    position: relative; 
} 
.rowMousedOver{ 
    background-color: #E2E66D !important; 
} 
.alternate { 
    background-color: #FCFEE8; 
} 

e qui è un po 'di codice HTML di esempio:

<div class="fieldRow alternate"> 
       <div class="label"><label id="title_label" for="title"> Title: </label></div> 
       <div class="fieldWrapper required text"> 
        <div class="cellValue"><input type="text" onchange="validateField(this)" name="title" id="title" value="Tax Free Savings Accounts" disabled=""></div> 
       </div> 
      </div> 

e via javascript aggiungo rowMousedOver al fieldRow quando è librato.

Qualche idea sul perché questo non funziona? Ho anche provato a usare behavior: url(PIE.htc), ma non ho avuto fortuna neanche con quello.

Grazie!

Answer 1

Le richieste PIE.htc devono rispondere con il tipo mime "text/x-component" - o IE non toccherà il comportamento. Il PIE.php che usi dovrebbe risolvere questo problema. Se non sei sicuro che sia così, usa la funzionalità Net di FireBug per controllare una richiesta diretta al file.

Si noti inoltre che il percorso di PIE.htc è relativo alla PAGINA HTML - non relativo al file css che ci si aspetterebbe. Quindi considera di rendere il percorso verso l'htc assoluto. Qui FireBug può aiutarti nuovamente a rilevare se hai un problema 404.

Maggiori informazioni presso http://css3pie.com/documentation/known-issues/

Answer 2

Il problema potrebbe essere nel tuo percorso, a seconda di dove hai inserito il file PIE.htc. Si noti che la documentazione di Pie 'iniziare' (here) cita quanto segue:

... sarà necessario modificare il percorso in modo che corrisponda dove è stato caricato PIE.htc al punto 2. Nota: questo percorso è relativo al file HTML visualizzato, non al file CSS da cui viene chiamato.

Così behavior: url(PIE.htc); dovrebbe funzionare se il file PIE.htc si trova nella stessa cartella del file html (almeno, ha funzionato per me :-)).

Tuttavia, non si sa cosa si vuole vedere arrotondato ... il div che sarebbe interessato non sembra avere caratteristiche visibili. Se si desidera vedere il div con gli angoli arrotondati, è possibile rendere visibile il bordo o lo sfondo, ad esempio aggiungendo border: 1px solid black; o background-color: someColor; alla classe fieldrow.

Se volete vedere il campo di input arrotondato, si potrebbe desiderare di dichiarare la classe come .fieldRow input {...}

Answer 3

provare ad aggiungere un position: relative in voi CSS dichiarazione. Ho avuto quel problema un paio di volte e normalmente è risolto facendo così. Ulteriori informazioni sono disponibili al: http://css3pie.com/documentation/known-issues/

Answer 4

Prova ad aggiungere

position:relative; 
z-index: 0; 

come suggerito qui http://css3pie.com/forum/viewtopic.php?f=3&t=10

Answer 5

risposta del neofita qui (per usare un commento condizionale nella sezione head) mi ha aiutato quando tutto il resto sembrava bene/non ha fatto la differenza (sulla più semplice delle pagine di test, da IIS 7 con IE8)

http://www.webmasterworld.com/forum83/9144.htm

Speranza che aiuta qualcuno

Answer 6

Anche la pena notare - ho avuto un problema in cui gli angoli arrotondati non funzionavano in LTE IE8 quando avevo impostare un colore di sfondo con un !important regola dopo. Un altro motivo per non usare! Importante!

Answer 7

Una soluzione che funziona per me è la seguente:

1. Il percorso per PIE.htc deve essere per esempio assoluto comportamento: url (App_Themes/default/PIE.htc)
2. Assicurarsi che il div che si imposta il comportamento in ha uno stile di position: relative

Dan