मीडिया क्वेरी फुलस्क्रीन

Question

के लिए मैं निम्नलिखित मीडिया क्वेरी का उपयोग पूर्ण स्क्रीन मोड में मेरी सीएसएस ओवरराइड लागू करने के लिए:

@media (device-width: 100vw) and (device-height: 100vh) { 
    .content { 
    padding: 0px !important; 
    } 
} 

फ़ायरफ़ॉक्स में पूरी तरह से काम करता है में लेकिन क्रोम में बहुत अविश्वसनीय (विंडोज 7 x64 पर दोनों नवीनतम संस्करण)। मैं केवल अपने ओवरराइड को लागू करने का प्रयास कर सकता हूं जब पूर्णस्क्रीन मोड में नहीं, लेकिन क्वेरी को उलटा करने की आवश्यकता है। तो मेरे प्रश्न हैं:

1. क्या क्रोम क्वेरी का समर्थन करना चाहिए?
2. मैं इसे कैसे अस्वीकार करूं (तार्किक नहीं)?

पेज।

मेरे viewport इस तरह घोषित किया जाता है:

<meta name="viewport" content="width=device-width, initial-scale=1.0"/> 

Answer 1

यह कम सुरुचिपूर्ण, लेकिन और अधिक मजबूत, पूर्ण स्क्रीन घटना को सुनने के लिए हो सकता है, तो शायद एक is-fullscreen वर्ग शरीर के लिए तो आप लिख सकते हैं जोड़ने इस तरह अपने नियम:

body.is-fullscreen .content { padding... 

उदाहरण के लिए:

document.addEventListener('fullscreenchange', function() { 
    document.body.classList.toggle('is-fullscreen', document.fullscreenEnabled); 
}); 

इस घटना में विक्रेता-प्रीफ़िक्स्ड संस्करण हैं, इसलिए सुनिश्चित करें कि आप अपनी जरूरतों को पूरा कर रहे हैं।