गैलेक्सी नेक्सस/एंड्रॉइड 4 पर व्यूपोर्ट टैग क्यों काम नहीं कर रहा है?

Question

मैं एक ऐसे वेब ऐप पर काम कर रहा हूं जिसे किसी डिवाइस के किसी भी स्क्रीन आकार में आकार बदलना चाहिए। आईओएस और पुराने एंड्रॉइड संस्करणों पर व्यूपोर्ट टैग ठीक काम करता है। स्क्रीन पर तस्वीर हमेशा स्क्रीन फिट करने के लिए आकार बदलती है।
(यहां वर्णित की तरह: https://developer.apple.com/library/ios/#DOCUMENTATION/AppleApplications/Reference/SafariWebContent/UsingtheViewport/UsingtheViewport.html#//apple_ref/doc/uid/TP40006509-SW19)
गैलेक्सी नेक्सस (एंड्रॉइड 4.0) पर यह काम नहीं करेगा। बाएं और दाएं तरफ लगभग 20 पीएक्स स्पेस है और मुझे नहीं पता कि वह ऐसा क्यों करता है। मेरे व्यूपोर्ट टैग इस तरह दिखता है: कोई बात नहीं मैं टैग के बारे में क्या बदल

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

, अंतरिक्ष हमेशा वहाँ है और सामग्री स्क्रीन पर फिट नहीं करता है। मैंने आपको प्रभाव दिखाने के लिए एक नमूना पृष्ठ बनाया है: http://easyeve.w3y.de/link/index.html
यदि आप इस लिंक को किसी iPhone पर खोलते हैं तो सामग्री पूरी तरह से फिट होती है (आपको पीले = शरीर को कुछ भी नहीं दिखाई देगा) और दस्तावेज़ चौड़ाई 320px है। गैलेक्सी नेक्सस पर आपको पीले रंग की जगह दिखाई देगी और दस्तावेज़ चौड़ाई 360 पीएक्स है (जो डिस्प्ले रेज़ोल्यूशन का बिल्कुल आधा है)। यह 320 पीएक्स भी होना चाहिए! क्या आपको यह समस्या भी है और क्या इसे ठीक करने का कोई तरीका है?

अपडेट: मैंने गैलेक्सी नोट/एंड्रॉइड 2.3.6 पर एक ही समस्या देखी है इसलिए यह एंड्रॉइड 4 मुद्दा नहीं है। यह .. बड़े स्क्रीन आकार मुझे लगता है के साथ क्या करना है

Answer 1

यहाँ बहुत ही इस मुद्दे (गैलेक्सी नेक्सस - एंड्रॉयड 4.0.2), मैं डिफ़ॉल्ट ब्राउज़र

सेटिंग में के बारे में नियमित रूप से वेब पेज बात कर रहा हूँ व्यूपोर्ट मेटा प्रारंभिक-स्केल कम 1 (ज़ूम आउट) ब्राउज़र द्वारा अनदेखा प्रतीत होता है। 1 से अधिक मूल्य (ज़ूम-इन) ठीक काम करता है।

ब्राउज़र (सेटिंग-> उन्नत) आप चीजों को बदल सकते हैं, जहां में सेटिंग्स हैं:

1. डिफ़ॉल्ट ज़ूम - यह फर्क नहीं पड़ता है, लेकिन यह समस्या ठीक नहीं होती
2. स्वत: फ़िट पृष्ठ - में मेरे मामले कोई फर्क नहीं पड़ता

सब कुछ क्रोम ब्राउज़र (इस समय बीटा) में सिर्फ सही काम करने के लिए लगता है, लेकिन यह है कि आईसीएस/Galaxy Nexus के लिए नहीं डिफ़ॉल्ट ब्राउज़र है।

अद्यतन (समाधान):

मेटा व्यूपोर्ट "चौड़ाई = उपकरण-चौड़ाई" की स्थापना Galaxy Nexus के विफल रहता है।
सेटिंग "चौड़ाई = 1280" बस महान काम करता है (1280 पीएक्स आकाशगंगा नेक्सस की स्क्रीन की चौड़ाई है)।

कि सेटिंग खबरदार "चौड़ाई = 1280, उपयोगकर्ता-मापनीय = नहीं" इसे फिर से टूट जाता है (यदि आप बाहर ज़ूम कर सकते हैं उपयोगकर्ता के स्केलेबल है, भले ही = नहीं) :(

Answer 2

मैं इस समस्या के साथ आज तकरार समाप्त हो गया मेरा मुद्दा थोड़ा और जटिल था, क्योंकि मुझे बेस सीएसएस के अलावा वर्डप्रेस स्टाइलशीट (किसी अन्य विषय से) से निपटना पड़ा। क्रोम ने अपने फोन और टैबलेट पर पूरी तरह से काम किया और स्टॉक ब्राउजर ने टैबलेट पर भी ठीक काम किया हालांकि, शेयर ब्राउज़र ज़ूम आउट कर रहा था और मुझे डेस्कटॉप दृश्य दिखा रहा था।दोनों तरफ कोई मार्जिन नहीं था, जो सही व्यवहार था, लेकिन ब्राउज़र को मेरी साइडबार और सामग्री divs से फ्लोट को हटा देना चाहिए था और मुख्य सामग्री में ज़ूम किया जाना चाहिए (मैं @media प्रश्नों का उपयोग कर रहा हूं)। जैसा कि यह अजीब लगता है, मैंने वास्तव में ज़ूम सेटिंग को सुदूर, ताज़ा करने और फिर ज़ूम को मध्यम और रीफ्रेश करने पर रीसेट करने के द्वारा सेट किया है।

मुझे यह इंगित करना चाहिए कि जब मैंने आपके पृष्ठ के HTML और CSS पर देखा, तो मैंने देखा कि आपने अपने पृष्ठ div के लिए एक विशिष्ट पिक्सेल चौड़ाई निर्धारित की है। मुझे पूरा यकीन है कि आपको इसके बजाय चौड़ाई के लिए प्रतिशत का उपयोग करने की आवश्यकता है। उदाहरण के लिए, मेरे केंद्रित सामग्री div में margin: 0 auto;, min-width:320px;, max-width:900px;, और width:100%; है।

Answer 3

मैं गैलेक्सी टैब 2 पर कुछ हद तक समानता में भाग गया। जब आप वेबसाईटिंग को एप्लासीशन के लिए सेट अप करते हैं, तो WebViewSettings.setUseWideViewPort (true) सेट करने का प्रयास करें; यह एंड्रॉइड को व्यूपोर्ट मेटा टैग पर विचार करने के लिए मजबूर करेगा। मेरे ऐप के लिए गैलेक्सी टैब 2 के मामले में इसे अनदेखा किया जा रहा था और व्यूपोर्ट में सबकुछ गलत तरीके से ड्राइंग कर रहा था जब तक कि मैंने इसे बदल नहीं दिया।