कौन सा शुल्क

की कमी पर ध्यान दें <meta name="viewport" content="width=device-width, initial-scale=1">, जो मोबाइल उपकरणों में साइटों के जूमिंग पहलू को निष्क्रिय कर देता है। इसके अलावा, हम अपने कंटेनर की चौड़ाई को रीसेट करते हैं और नेवबार को ढहने से बचाने के लिए बदल दिया है, और मूल रूप से जाने के लिए अच्छा है।

नेवबार के बारे में

एक प्रमुख के रूप में, नेवबार घटक यहाँ बल्कि मुश्किल है क्योंकि इसे प्रदर्शित करने की शैलियाँ विशिष्ट और विस्तृत हैं। यह सुनिश्चित करने के लिए ओवरराइड करता है कि डेस्कटॉप शैलियों का प्रदर्शन उतना अच्छा या चिकना नहीं है जितना कोई चाहेगा। बस इस बात से अवगत रहें कि नावबार का उपयोग करते समय इस उदाहरण के शीर्ष पर निर्माण करते समय संभावित गोचर हो सकते हैं।

ब्राउज़र, स्क्रॉलिंग और निश्चित तत्व

गैर-उत्तरदायी लेआउट निश्चित तत्वों की एक प्रमुख कमी को उजागर करते हैं। जब व्यूपोर्ट पृष्ठ सामग्री की तुलना में संकरा हो जाता है, तो कोई भी निश्चित घटक, जैसे कि एक निश्चित नावबार, स्क्रॉल करने योग्य नहीं होगा। दूसरे शब्दों में, 970px की गैर-प्रतिक्रियाशील कंटेनर चौड़ाई और 800px के व्यूपोर्ट को देखते हुए, आप संभावित रूप से 170px सामग्री छिपा सकते हैं।

इसके आसपास कोई रास्ता नहीं है क्योंकि यह डिफ़ॉल्ट ब्राउज़र व्यवहार है। एकमात्र समाधान एक उत्तरदायी लेआउट या गैर-निश्चित तत्व का उपयोग करना है।

गैर-उत्तरदायी ग्रिड प्रणाली

एक तिहाई
एक तिहाई
एक तिहाई