2010-07-31 3 views
5

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

enter image description here

किसी को भी करने से पहले इस पार आ गया है, और यदि हां, तो आप इसके लिए एक ठीक पता है? मैं शायद इस बारे में गलत तरीके से जा रहा हूं, लेकिन मैंने लगभग पूरी तरह से परीक्षण और त्रुटि से सीएसएस सीखा है, इसलिए इसके सिद्धांत के बारे में मेरा ज्ञान सबसे अधिक संभावना है।

+0

क्या आप jsfiddle.net का उपयोग कर डेमो पोस्ट कर सकते हैं? –

+0

मैं बाद में कुछ नमूना कोड प्राप्त करने का प्रयास करूंगा। अभी के लिए, एक साधारण, अगर बहुत ही सुरुचिपूर्ण फिक्स नहीं था तो सामग्री div के अंदर एक दूसरा div जोड़ने के लिए, एक फ्लोट के साथ: बाईं ओर विशेषता। – Jim

उत्तर

3

यदि सामग्री पैनल फ़्लोट नहीं किया गया है, तो अंदर के किसी भी तत्व साइडबार फ्लोट को साफ़ कर देंगे। आसान समाधान सामग्री पैनल तैरना होगा। चूंकि आपने HTML/css पोस्ट नहीं किया है, इसलिए वास्तव में समस्या को देखना मुश्किल है, और यदि आप सामग्री पैनल को फ़्लोट नहीं करना चाहते हैं तो इसके लिए कोई सुझाव प्रदान करें।

Before

After

+0

सामग्री पैनल फ़्लोट करना मुझे लगता है कि समाधान की तरह लगता है। हालांकि, नेविगेशन बॉक्स के नीचे सामग्री पैनल को मजबूर करने, लेआउट के साथ इतना गड़बड़ कर रही है। हालांकि यह एक अलग मुद्दा है, इसलिए मैं आपका जवाब स्वीकार करूंगा :) – Jim

+0

यदि आपको कोई फर्क नहीं पड़ता है तो यह भविष्य के प्रश्न में पूर्ण लेआउट देखने में मदद करेगा, इसलिए हम सभी इसे देख सकते हैं। –

0

मेरा मानना ​​है कि आप चुनिंदा, एक तरफ तैरता स्पष्ट करने के clear: right; या clear: left;

की तरह मुझे लगता है कि इस मुद्दे की जांच नहीं चला है, हालांकि तो मैं नहीं कर रहा हूँ चाहेगा ज़रूर।

-2

आप प्रदर्शित करने का प्रयास कर सकते हैं: इनलाइन-ब्लॉक। लेकिन यह एक नई सुविधा है जो अच्छी तरह से समर्थित नहीं है। सीएसएस एक कुत्ता है, मैं बस अपने डिजाइनों को फिट करने के लिए बदलता हूं जो यह कर सकता है।

https://learn.shayhowe.com/html-css/positioning-content/

या, बस तालिकाओं का उपयोग। टेबल्स बस काम करते हैं।

+0

सभी ब्राउज़र आईई समेत 'इनलाइन-ब्लॉक' का समर्थन करते हैं, जिसमें संस्करण 8 पर वापस आ गया है। लेकिन यह प्रश्न सात साल पुराना है, स्वीकृत उत्तर सहित, इसलिए मुझे नहीं पता कि आपने जवाब क्यों दिया। – Rob