CSS-Medien Abfrage auf Windows Phone Ziel Nokia Lumia

Question

Ich benutze unter LESS zu zielen Handys und alle anderen Geräte funktionieren, aber Window Telefon Position: relativ bricht die gesamte Benutzeroberfläche.

Wie kann ich nur Windows-Telefon gezielt mit Media-Abfragen.

Ich habe unten Lösungen durch, aber sie verwenden bedingte CSS-Tag und mein Projekt verwendet weniger.

CSS to target Windows Phone 7

Und unten Lösung Ziele dpi, die wahrscheinlich in zukünftigen Geräten ändern könnte. Daher löst das mein Problem nicht.

@media query to target hi-res Windows Phone 8+?

Answer 1

Danke Zitscher für Ihre Eingaben. Aber ich fand einen Hack, der http://blog.simian.co/en/tips/internet-explorer-10-mobile-css-hacks-windows-phone/ für mich gearbeitet (dies jemandem nützlich sein kann)

@media screen and (-ms-high-contrast: active) and (max-width: 30em), 
(-ms-high-contrast: none) and (max-width: 30em) { 
     width: 130px !important; 
     padding-left:18px !important; 
} 

Dies ist, was ich suchte. Danke für Ihre Hilfe.

Answer 2

Ich würde nicht nur auf Medienanfragen verlassen, wenn Stile für ein bestimmtes Gerät anwenden. Versuchen Sie die Kontroll Bibliothek is.js mit (http://is.js.org/#windowsPhone) wie in diesem Beispiel:

if(is.windowsPhone()) { 
    $('body').addClass('is-windows-phone') 
} 

Jetzt in Ihrem Stile, die Sie so etwas tun könnte:

body.is-windows-phone ul#fancyWindowsPhoneList li { 
    position: relative; 
    top: 4px; 
    zoom: 0.5; 
    width: 46px; 
} 

hoffe, das hilft!