CSS3 PIE - Dawanie pomocy IE border-radius nie działa?

Question

Próbuję zaokrąglić rogi w IE z dołączonym zachowanie CSS3 PIE.

Oto mój 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; 
} 

a oto niektóre próbki HTML:

<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> 

i poprzez javascript dodam rowMousedOver do fieldRow gdy jest on unosił.

Każdy pomysł, dlaczego to nie działa? Próbowałem również używać behavior: url(PIE.htc), ale nie miałem z tym szczęścia.

Dzięki!

Answer 1

Żądania PIE.htc powinny odpowiadać mime typu "text/x-component" - lub IE nie będzie dotykać zachowania. PIE.php, którego używasz, powinno to naprawić. Jeśli nie masz pewności, czy tak jest, skorzystaj z funkcji sieci FireBug, aby sprawdzić bezpośrednie żądanie do pliku.

Należy również zauważyć, że ścieżka do PIE.htc jest względna do strony HTML - nie w stosunku do pliku css, którego można się spodziewać. Więc rozważ ścieżkę do .htc absolute. Tutaj FireBug pomoże ci ponownie wykryć, czy masz 404 problem.

Więcej informacji na http://css3pie.com/documentation/known-issues/

Answer 2

Problem może znajdować się na Twojej ścieżce, w zależności od miejsca umieszczenia pliku PIE.htc. Zauważ, że Pie „podręczny” dokumentacja (here) wymienia następujące:

... trzeba będzie dostosować ścieżkę pasujące do której dodany PIE.htc w kroku 2. Uwaga: Ta ścieżka jest względna do wyświetlanego pliku HTML, a nie do pliku CSS, z którego jest wywoływany.

Więc behavior: url(PIE.htc); powinno działać, jeśli plik PIE.htc jest w tym samym folderze co plik html (przynajmniej, że pracował dla mnie :-)).

Jednak nie jestem pewien, co chcesz zobaczyć zaokrąglone ... div, który został dotknięty, wydaje się nie mieć żadnych widocznych cech. Jeśli chcesz zobaczyć element div z zaokrąglonymi narożnikami, możesz chcieć uczynić obramowanie lub tło widoczne, takie jak dodanie border: 1px solid black; lub background-color: someColor; do klasy fieldrow.

Jeśli chcesz zobaczyć pole wejściowe zaokrąglone, możesz zadeklarować klasę jako .fieldRow input {...}

Answer 3

Spróbuj dodać position: relative do ty css oświadczenie. Kilka razy miałem tę kwestię i zwykle to rozwiązuje. Więcej informacji można znaleźć pod adresem: http://css3pie.com/documentation/known-issues/

Answer 4

spróbuj dodać

position:relative; 
z-index: 0; 

jak sugeruje tutaj http://css3pie.com/forum/viewtopic.php?f=3&t=10

Answer 5

odpowiedź neofita jest tutaj (w użyciu warunkowego komentarz w sekcji head) pomógł mi, gdy wszystko wydawało grzywny/nie ma znaczenia (na najprostszych stronach testowych, od IIS 7 z IE8)

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

nadzieję, że pomoże komuś

Answer 6

Warto również zauważyć - Miałem problem, gdzie zaokrąglone narożniki nie działa w LTE IE8 kiedy bym ustawić kolor tła z !important reguły po nim. Kolejny powód, którego nie warto używać! Ważne!

Answer 7

Rozwiązanie, które działa na mnie jest następujący:

1. Ścieżka PIE.htc musi być całkowity, np Zachowanie: url (App_Themes/default/PIE.htc)
2. Upewnij div, które ustawia zachowanie się ma styl position: relative

Dan