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

1।

यदि मार्जिन वर्तमान में मार्जिन नहीं है, तो मार्जिन जोड़ें और केवल एक छोटी राशि से ओवरलैप करें। आप केवल एक तरफ एक मार्जिन सेट कर सकते हैं, जैसे कि बाईं ओर, यदि आप केवल अन्य बॉक्स तत्व को दूर करने के लिए मार्जिन तत्व का उपयोग करना चाहते हैं। उदाहरण के लिए, यदि div A और div B को एक-दूसरे के बगल में रखा गया है और div B को बाईं ओर से ओवरलैप किया जा रहा है, तो आप अपनी शैली शीट को संशोधित करके बाईं ओर के मार्जिन को जोड़ने के लिए A को निम्नानुसार जोड़ सकते हैं:

{चौड़ाई: 100px; मार्जिन-बाएं: 10 पीएक्स; }

2।

स्थिति मानों के लिए अपनी स्टाइल शीट खोजें जो ओवरलैप का कारण बन सकती हैं और उन्हें बदल सकती हैं। यदि आप अपनी वेबसाइट के दिव्य तत्वों को व्यवस्थित करने के लिए पूर्ण स्थिति का उपयोग कर रहे हैं, तो यह सभी के लिए एक मुफ्त है - कोई भी तत्व पृष्ठ पर किसी भी अन्य तत्व को ओवरलैप कर सकता है। इसलिए अगर आपने A सेट को 100 पिक्सेल चौड़ा और 15 पिक्सेल पृष्ठ के ऊपर और बाएँ से विभाजित किया है, तो div B को ओवरलैप नहीं करने के लिए बाईं ओर कम से कम 115 पिक्सेल होने चाहिए। आप A से स्थिति निर्दिष्ट कर सकते हैं। ऊपर या नीचे, और दाएं या बाएं से।

3।

एक विशिष्ट चौड़ाई के साथ एक div सेट करें और ओवरफ्लो को छिपाएं। यह div को एक निर्दिष्ट आकार से अधिक होने से रोकता है और सामग्री को अधिक फैलने से रोकता है, इसलिए बोलने के लिए। उदाहरण के लिए, यदि div A में सेट चौड़ाई नहीं है और आप इसमें एक बड़ी छवि रखते हैं, तो छवि को समायोजित करने के लिए div अपने आप विस्तृत हो जाएगी। यदि आप चौड़ाई सेट करते हैं, तो छवि अभी भी div के किनारों से परे प्रदर्शित होगी, लेकिन div का विस्तार नहीं होगा। यदि आप अतिप्रवाह छिपाते हैं, तो छवि केवल div की सीमाओं के भीतर दिखाई देगी और तत्व का विस्तार नहीं करेगी। उदाहरण के लिए, Div A को 200 पिक्सेल चौड़ा और ओवरफ्लो न करने के लिए सेट करने के लिए, आप इस शैली कोड का उपयोग करेंगे:

{चौड़ाई: 200px; छिपा हुआ सैलाब; }

4।

स्वचालित रूप से साइड बॉक्स को स्टैक करने के लिए "फ्लोट" विकल्प का उपयोग करें। उदाहरण के लिए, आप अपनी सामग्री रखने के लिए div A को साइडबार और div B के रूप में कार्य करना चाहते हैं - आप दोनों divs को बाईं ओर फ्लोट कर सकते हैं, इस प्रकार उन्हें क्षैतिज रूप से संरेखित कर सकते हैं। तैरते हुए दिव्य तत्व ओवरलैप नहीं होंगे। दो तैरने वाले तत्वों का एक उदाहरण कुछ इस प्रकार है:

{चौड़ाई: 150px; बाईंओर तैरना; }

b {चौड़ाई: 400px; बाईंओर तैरना; }

टिप्स

• यदि आप फ़ायरफ़ॉक्स का उपयोग करते हैं, तो आप एक बॉक्स पर राइट-क्लिक कर सकते हैं और "इंस्पेक्ट एलिमेंट" चुन सकते हैं। यह आपको प्रत्येक तत्व की एक दृश्य रूपरेखा देता है जो अक्सर आपको एक विशेष रूप से मुश्किल समस्या को इंगित करने में मदद कर सकता है।
• आप "अतिप्रवाह-एक्स" या "अतिप्रवाह-वाई" का उपयोग करके केवल एक्स या वाई अक्ष पर छिपाने के लिए ओवरफ्लो सेट कर सकते हैं।