मेरे वेबपेज के मध्य में मेरा पाद क्यों है?

एक वेबसाइट पाद लेख वेब पेज के बीच में दिखाई दे सकता है और नीचे कई कारणों से नहीं। सबसे आम में से एक यह है कि वेबसाइट की सामग्री छोटी है और पाद को मध्य तक धकेल दिया जाता है। पाद के साथ "" कंटेनरों को गलत तरीके से कोडित किया जा सकता है, मार्जिन या पैडिंग गलत हो सकता है और "फ्लोट" संपत्ति गलत हो सकती है।

पाद की स्थिति

पाद लेख सीएसएस "स्थिति" संपत्ति यह निर्धारित करती है कि पाद लेख हेडर और मुख्य बॉडी कंटेंट जैसे अन्य पेज तत्वों के संबंध में वेब पेज पर स्थित है। पांच प्रकार की स्थिति स्थिर स्थिति, निश्चित स्थिति, सापेक्ष स्थिति, अतिव्यापी स्थिति और पूर्ण स्थिति है। पाद लेख में पूर्ण स्थिति का उपयोग किया जाता है ताकि पाद तत्व अन्य तत्वों के संबंध में व्यवहार न करे। "स्थिति जोड़ें: पूर्ण;" "#footer" ब्रैकेट "{" और "}" टैग के अंदर कोडिंग। इसके अलावा, "नीचे: 0; जोड़ें" सीधे "स्थिति" कोडिंग के नीचे लाइन में। अब फूटर वेब पेज "डीआईवी" कंटेनर के निचले भाग में स्थित है।

पाद चौड़ाई और ऊँचाई

पाद की चौड़ाई और ऊंचाई के गुण पाद स्थिति के साथ हस्तक्षेप कर सकते हैं। यदि पाद बहुत बड़ा है, तो यह वेब पेज के निचले भाग में बहुत अधिक जगह लेता है। "#Footer" ब्रैकेट के टैग के भीतर "{" और "}" को "चौड़ाई: Xpx" सूचीबद्ध किया गया है; और "ऊंचाई: Xpx;" कोडिंग। वेबसाइट की बाकी सामग्री की तरह फूटर को चौड़ा बनाने के लिए चौड़ाई को "100%" में बदलें। इच्छित पिक्सेल आकार में ऊँचाई बदलें, जैसे "60px" या "75px।" ये दोनों बदलाव वेब पेज के निचले हिस्से तक धकेल दिए जा रहे पाद में योगदान कर सकते हैं।

मार्जिन और पैडिंग

मार्जिन और पेडिंग कोडिंग पाद लेख की स्थिति में हस्तक्षेप कर सकते हैं। जब पाद हाशिये बहुत संकीर्ण होते हैं या गद्दी बहुत अधिक चौड़ी होती है, तो पाद स्थिति अलग हो जाती है और वेब पेज के मध्य में जा सकती है। एक आसान उपाय यह है कि मार्जिन और पैडिंग को पूरी तरह से हटा दिया जाए, ताकि उन पाद लेखों के गुण बाकी कोडिंग के अनुरूप हों। वेब पेज कोडिंग में "#footer" संपत्ति का पता लगाएँ। "{" और "}" के ब्रैकेट टैग के भीतर "मार्जिन: Xpx Xpx Xpx Xpx;" और "पैडिंग: Xpx Xpx Xpx Xpx;" कोडिंग। अब वेब पेज के शीर्ष पर "#body" और "#container" टैग के द्वारा पाद मार्जिन और पैडिंग का निर्धारण किया जाता है। दोनों कोडिंग लाइनें निकालें और वेब पेज को रिफ्रेश करें।

कंटेनर लेआउट

एक वेबसाइट पाद लेख एक तत्व है जो समग्र DIV कंटेनर लेआउट में स्थित है। जब कंटेनर लेआउट गुण गलत होते हैं, तो यह वेब पेज के भीतर पाद लेख की स्थिति को प्रभावित कर सकता है। "{" और "}" "#container" ब्रैकेट टैग के अंदर समान "ऊँचाई" और "स्थिति" गुण हैं। "ऊँचाई" को 100% पर बदलें और "स्थिति" को सापेक्ष में बदलें। कोडिंग की एक नई लाइन "#container" में जोड़ें और "min-height: 100%;" टाइप करें, जो पूरे कंटेनर लेआउट को एक नई न्यूनतम ऊंचाई देता है। अब संपूर्ण वेब पेज सामग्री की मात्रा की परवाह किए बिना स्क्रीन की पूरी ऊंचाई पर रहेगा। रिश्तेदार की स्थिति भी पाद की पूर्ण स्थिति के साथ सकारात्मक बातचीत करती है।