2010-02-04 11 views
7

में स्क्रीन की पूरी चौड़ाई को फैलाने के लिए कंटेनर div के दाएं कारण फ़्लोटिंग div का कारण मैंने एक समान प्रश्न here देखा, और कोई जवाब नहीं देखा। मुझे एक समस्या है जहां एक मूल div के अंदर एक तत्व सही हो जाता है, और यह div को आईई 7 में पृष्ठ की पूरी चौड़ाई को फैलाने का कारण बनता है। यह किसी अन्य ब्राउज़र (फ़ायरफ़ॉक्स और क्रोम) में नहीं होता है। संदर्भ के लिए मैंने प्रश्न के बाद चित्र भी पोस्ट किए हैं। मैं जिस HTML का उपयोग कर रहा हूं वह नीचे है:सीएसएस: आईई

<div id="journal" class="journalIE"> 
    <div class="title_bar"> 
     <div> 
      Testing 
     </div> 
     <div class="actions"></div> 
     <div class="clear"></div> 
    </div> 
</div> 

सीएसएस मैं इन टैग्स के लिए उपयोग कर रहा हूं, साथ ही नीचे भी है। एक बात जो मैंने उपरोक्त संदर्भित अन्य व्यक्ति के प्रश्न के बीच सुसंगत देखी, और मेरी समस्या यह है कि दोनों माता-पिता div की स्थिति लागू होती है (उपर्युक्त व्यक्ति पूर्ण है, मैंने तय किया है)।

#journal 
{ 
    z-index: 1; 
} 

.journalIE 
{ 
    right: 1px; 
    bottom: 18px; 
    position: fixed; 
} 

#journal .title_bar 
{ 
    background: #F3F3F3; 
    border: 1px solid #C5D6E8; 
    color: #363638; 
    font-size: 11pt; 
    font-weight: bold; 
    height: 20px; 
    padding: 4px; 
    margin-bottom: 4px; 
} 

#journal .title_bar .actions 
{ 
    float: right; 
} 

.clear 
{ 
    clear: both; 
} 

ध्यान दें कि 'क्रियाएं' कक्षा सही हो गई है। अगर मैं उस फ्लोट को दूर ले जाता हूं, तो मेरा बॉक्स this जैसा दिखता है। लेकिन फ्लोट के साथ, यह पूरी स्क्रीन फैलाता है, और this जैसा दिखता है। क्या यह एक ज्ञात आईई बग है, क्योंकि यह किसी अन्य ब्राउज़र में नहीं हो रहा है, और यह मुझे पागल कर रहा है।

उन लोगों के लिए, मेरे पास 'क्रियाओं' div में सामग्री थी, लेकिन सब कुछ नीचे की समस्या को दूर कर दिया है।

किसी भी सहायता की सराहना की जाएगी। बहुत बहुत धन्यवाद।

उत्तर

0

क्या इस

<div id="journal" class="journalIE"> 
<div class="title_bar"> 
    <div class="Test"> 
     Testing 
    </div> 
    <div class="actions"></div> 
    <div class="clear"></div> 
</div> 

और फिर एक CSS वर्ग को जोड़ने के

.test { फ्लोट: सही; }

इसे करना चाहिए, हमें बताएं कि यह काम नहीं करता है या नहीं। * एक जारी बॉक्स एक स्पष्ट चौड़ाई ('चौड़ाई' संपत्ति के माध्यम से सौंपा है या प्रतिस्थापित तत्वों के मामले में उसके अंतर्निहित चौड़ाई) होना चाहिए:

MNK

+0

त्वरित उत्तर के लिए धन्यवाद। दुर्भाग्यवश, 'क्रियाओं' div के साथ अभी भी सही हो गया है, यह अभी भी पृष्ठ की पूरी चौड़ाई फैला है, और अभी तक "परीक्षण" को अभी तक दाएं रखें। यहां चित्र: http://i49.tinypic.com/5ap4bk.jpg –

1

आपको एक चौड़ाई की जरूरत है। *

के माध्यम से: W3C

+0

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

+1

इसके अलावा, आप किस बॉक्स को चौड़ाई देने का सुझाव दे रहे हैं? मैंने उसी परिणाम के साथ .journalIE कक्षा से 'फ्लोट: दाएं 'लिया। –

0

मैं, पूरी तरह से सुनिश्चित करें कि आप क्या चाहते हैं नहीं कर रहा हूँ के रूप में आप की व्याख्या नहीं की थी क्या आप "कार्रवाई" div के साथ करना चाहता था, लेकिन यदि आप करने के लिए "कार्रवाई" div चाहता था "परीक्षण" div के बगल में तैरते हुए, मैंने बस एक अलग .floatr वर्ग बनाने की कोशिश की, या यह भी काम करेगा यदि आप सीधे div पर शैली लागू करते हैं।

.floatr { 
float: right; 
} 
.floatr वर्ग के साथ

, "कार्रवाई" करने के लिए लागू होने वाले div:

<div class="actions floatr"></div> 

मैं पता नहीं क्यों, लेकिन यह है कि "कार्रवाई" div नाव में स्थापित करने की अनदेखी कर रहा है मुझे लगता है जिस वर्ग को आप इस तरह से सेट करते हैं। मैं व्यक्तिगत रूप से divs में कई वर्गों को लागू करना पसंद करता हूं, जो मुझे उस वर्ग को अन्य divs पर पुन: उपयोग करने की अनुमति देता है जिसके लिए मैं उस प्रभाव को चाहता हूं, लेकिन मैंने सुना है कि कुछ ब्राउज़र पहले के बाद घोषित किसी भी वर्ग को अनदेखा कर देंगे। ओह ठीक है, मैंने अभी तक प्रमुख ब्राउज़र के साथ उस समस्या में भाग नहीं लिया है ...

ओह रुको।

मैंने कोड को फिर से देखा, और मुझे लगता है कि आपको अपनी कक्षाओं को सेट करने में कोई समस्या है। कुछ यह पता लगाने की क्या आप वाकई यह तरीके से व्यवहार कर सकते हैं यह उम्मीद करने के लिए सीधे प्रभाव लागू होगा

#journal .title_bar, .actions 
{ 
    float: right; 
} 

मैं कभी कभी लगता है: अपने "कार्रवाई" div बाहर कार्रवाई पर याद आ रही थी, सीएसएस करने के लिए अल्पविराम जोड़ने का प्रयास करें करने के लिए, और फिर शायद यह कुछ प्रकार की वाक्यविन्यास त्रुटि है अगर यह काम करता है। हे।

संबंधित मुद्दे