पर इनलाइन-ब्लॉक पर मुझे उम्मीद है कि निम्नलिखित नमूने में दो स्पैन टैग एक दूसरे के बगल में प्रदर्शित होंगे, इसके बजाय वे एक के नीचे एक प्रदर्शित करेंगे। अगर मैं वर्ग अवधि की चौड़ाई निर्धारित करता हूं। सीधे 49% तक वे एक दूसरे के बगल में प्रदर्शित होते हैं। मैं यह समझने में सक्षम नहीं हूं कि दाएं अवधि की तरह सही अवधि को धक्का दिया गया है, इसमें कुछ अदृश्य पैडिंग/मार्जिन है जो इसे 50% से अधिक लेता है। मैं इसे HTML टेबल का उपयोग किए बिना करने की कोशिश कर रहा हूं। कोई विचार?स्पैन
<html>
<head>
<title>Test Page</title>
<style type='text/css'>
* {
margin: 0;
}
html,body{
margin:0;
padding:0;
height:100%;
width:100%;
border:none;
}
div.header{
width:100%;
height:80px;
vertical-align:top;
}
span.left {
height:80px;
width:50%;
display:inline-block;
background-color:pink;
}
span.right {
vertical-align:top;
display:inline-block;
text-align:right;
height:80px;
width:50%;
background-color:red;
}
</style>
</head>
<body>
<div class='header'>
<span class='left'>Left Span 50% width</span>
<span class='right'>Right Span 50% width</span>
</div>
</body>
</html>
स्पष्टीकरण के लिए धन्यवाद। फ्लोट: एफएफ 3.1 में अपेक्षित परिणामों के साथ खूबसूरती से काम करता है। दुर्भाग्यवश, आईई 6 में दायीं ओर अवधि 50% का 50% प्रस्तुत करती है, असल में यह ब्राउज़र विंडो के 25% की चौड़ाई देती है। अपनी चौड़ाई को 100% तक सेट करना वांछित परिणाम प्राप्त करता है लेकिन एफएफ 3.1 में टूट जाता है जो मानक अनुपालन मोड में है और मैं इसे समझता हूं। हैक्स का सहारा या जोड़ने एकाधिक सीएसएस पत्रक एक चुनौती का उपयोग कर रहा है
आईई 6 का समर्थन क्यों करें? http://www.ie6nomore.com/ – jrummell