2013-03-09 9 views
19

Mam rozszerzenie WebDeveloper i dostałem ostrzeżenie CSS, więc poszedłem je zbadać. Ostrzeżenie jest następujące:jQuery powoduje, że Firefox wymiarów o rozmiarach pudełek

Warning: Unknown property 'box-sizing'. Declaration dropped. 
Line: 0 

Potem zrobiłem pusty plik i zauważyłem, że go tam nie było. Kilka minut później znalazłem powtarzalną przyczynę: w tym skrypt jQuery 1.9.1!

Co mogę, a czego mam robić? Chcę używać jquery, ale uważam to za nieco irytujące, że zawsze będę widział ostrzeżenia CSS na moim pasku narzędzi.

<!DOCTYPE html> 
<html> 
<head></head> 
<body> 
<div>Empty</div> 
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script> 
</body> 
</html> 
+7

Ostrzeżenia CSS Firefoksa są bardzo głośne. W wielu przypadkach nie jest możliwe utworzenie funkcji między przeglądarkami bez pojawienia się niektórych (na przykład dowolna z wcześniejszych właściwości dostawcy lub filtry IE lub oficjalne właściwości, których jeszcze nie rozpoznaje). Tak więc obracanie się nimi nie jest tylko niepotrzebne, w rzeczywistości jest szkodliwe dla twojej witryny (minimum dodaje niepotrzebne warunki do plików). – Dave

+0

Z wyjątkiem ignorowania ich, jak się ich pozbyć z konsoli błędów? –

Odpowiedz

22

Opcje

  1. użyć jQuery 1.7.2.
  2. Podnieś problem za pomocą zespołu jQuery i licz na poprawkę (lub podaj ją samemu).
  3. Użyj Firebug zamiast WebDeveloper (który może lub nie może pomóc).
  4. Zignoruj ​​to.

Dopóki strona wyświetla się poprawnie, uważam, że jest to ostrzeżenie, które można bezpiecznie zignorować, nawet jeśli tworzysz witrynę wymagającą weryfikacji kodu CSS.

Ostrzeżenia powinien odejść tak szybko jak Firefox posiada pełne wsparcie dla box-sizing (bez konieczności prefiks -moz-), ale to nie nastąpi, dopóki pewnego wersji po Firefox 21.

informacji Tło

Ostrzeżenie powstaje z różnych składni wymaganych dla niektórych stylów CSS. Aby obsługiwać wszystkie przeglądarki, zazwyczaj musisz podać wszystkie różne składnie. Przeglądarki zignorują te, których nie rozpoznają.

W przypadku box-sizing, Firefox wymaga -moz- prefiks, wczesne wersje Safari Mobile i Android przeglądarka wymaga prefiksu -webkit-, a inne przeglądarki nie wymagają prefiksu w ogóle:

-webkit-box-sizing: content-box; 
    -moz-box-sizing: content-box; 
     box-sizing: content-box; 

Podobny problem powstaje podczas dodawania gradientu liniowego, w tym wypadku spowodowanego przez wartość zamiast nazwy właściwości:

background-image: -webkit-linear-gradient(top, #444, #999); 
background-image: -moz-linear-gradient(top, #444, #999); 
background-image:  -ms-linear-gradient(top, #444, #999); 
background-image:  -o-linear-gradient(top, #444, #999); 
background-image:   linear-gradient(top, #444, #999); 

kiedy ostrzeżenia wynikają z różnych składni stosowane, to zazwyczaj cas e weryfikatora lub konsoli błędów nie jest wystarczająco inteligentny, aby rozpoznać prawdziwy problem od nieszkodliwego, który jest często nieunikniony. Aby być uczciwym, w rzeczywistości jest to ostrzeżenie, a nie błąd.

Dodatkowe informacje

Nowsze wersje jQuery skorzystać z box-sizing stylu dla celów wewnętrznych. jQuery 1.8.0 generuje tylko jedno ostrzeżenie o wartości box-sizing, a jQuery 1.7.2 nie wytwarza żadnego.

jQuery może używać go w nieco nieostrożny sposób - bez uprzedniego sprawdzenia, czy jest jakiś rodzaj wsparcia dla niego - ale nie wyrządzając żadnej krzywdy.Jeśli tak, jeśli wystarczająco dużo osób narzeka na to do zespołu jQuery, kod jQuery może zostać refaktoryzowany w celu rozwiązania tego problemu (kosztem jQuery działa nieco wolniej).

Jeśli ostrzeżenie dotyczyło mniej niż -moz-box-sizing, a nie box-sizing, to raczej sugerowałoby to możliwy błąd w Firefoksie niż drobny problem z jQuery.

+0

możemy po prostu zignorować wiadomość. Przepisano dla mnie. –

Powiązane problemy