2013-02-20 8 views
5

Używam zapytań @media, aby ustawić tylko przeglądarki Chrome, aby ustawić "trójkąt -l." W określonej pozycji. Więc używam następującą metodęOsiągnij dwa rozmiary ekranu w przeglądarce Chrome Tylko

@media screen and (-webkit-min-device-pixel-ratio:0) { 
/* Fix for Chrome/Safari Users ONLY */ 

.l-triangle { 
    background: transparent url('../images/menu_bg_left.gif') no-repeat; 
    position: absolute; 
    float: left; 
    width: 55px; 
    height:75px; 
    display: block; 
    left: 0px; 
    top:0px; 
    z-index: 0; 
    -webkit-box-shadow: 0 8px 6px -6px rgba(0,0,0,0.7); 
     -moz-box-shadow: 0 8px 6px -6px rgba(0,0,0,0.7); 
      box-shadow: 0 8px 6px -6px rgba(0,0,0,0.7); 
} 

To działa OK dla przeglądarek Chrome o przekątnej ekranu większej niż 968px ale nie mniejszy niż 968px.

Moje pytanie brzmi: jak mogę przekazać 2 różne wartości css dla Tylko przeglądarki Chrome z 2 różnymi rozmiarami ekranu?

+0

Może patrząc na 'reaguje pięć - * less' pliki [Twitter Bootstrap] (https://github.com/twitter/bootstrap) nie daje pewne wskazówki.. Chociaż jest w LESS, zapytania '@ media' są nadal standardowymi CSS. – MTCoster

Odpowiedz

0

Myślę, że masz ten sam numer here.

Ta praca kod tylko na Chrome:

.chrome #thingie { 
    do: this; 
} 

Mam nadzieję, że pomoże.

0

Możesz używać operatorów takich jak "i" lub "nie" w zapytaniach o media.

@media screen and (-webkit-min-device-pixel-ratio:0) and (min-width: 968px) { 
...code here... 
} 
Powiązane problemy