क्यों आधुनिक ब्राउज़रों अभी भी इनलाइन ब्लॉक के बीच रिक्त स्थान रखूँ अगर वहाँ खाली स्थान के

है आप इस तरह मार्कअप है:क्यों आधुनिक ब्राउज़रों अभी भी इनलाइन ब्लॉक के बीच रिक्त स्थान रखूँ अगर वहाँ खाली स्थान के

<div class="inlineblock">one</div> 
<div class="inlineblock">two</div> 
<div class="inlineblock">three</div>

और इस तरह सीएसएस: .inlineblock {display: inline-ब्लॉक; }

आपको तत्वों के बीच रिक्त स्थान मिलेगा। अंतरिक्ष के बारे में 4px। जब तक आपका मार्कअप इस तरह दिखता है:

<div class="inlineblock">one</div><div class="inlineblock">two</div><div class="inlineblock">three</div>

अब, मैं क्या जानना चाहता हूं क्यों है?

इस पोस्टिंग के समय "अच्छे" ब्राउज़र अभी भी नवीनतम फ़ायरफ़ॉक्स, क्रोम और ओपेरा के तकनीकी कारण क्या हैं, यह अभी भी ऐसा करते हैं। मुझे लगता है कि इसके पीछे एक तकनीकी कारण है, अन्यथा यह अब तक तय किया गया होगा?

धन्यवाद!

स्रोत

2013-05-22 deweydb

क्यों नहीं? इनलाइन ब्लॉक तत्वों को टेक्स्ट के साथ इनलाइन दिखाई देने के लिए प्रोग्राम किया गया है। यदि इसमें टेक्स्ट है, तो इसे प्रस्तुत किया जाना चाहिए। – zneak

क्या आपने ब्राउज किए गए पुराने में गलती नहीं देखी है (वास्तव में यह विफलता नहीं है), उनमें से अधिकतर "इनलाइन-ब्लॉक" पूरी तरह से क्यों नहीं खड़े हो सकते थे। यह विफलता नहीं है, मैं अनुशंसा करता हूं कि आप सीएसएस-रीसेट का उपयोग करें। मेरी प्रतिक्रिया पढ़ें: http://stackoverflow.com/questions/16698142/why-do-modern-browsers-still-put-spaces-between-inline-block-if-there-is-whitesp/16698173#16698173 –

@Guilherme Nascimento पता नहीं क्यों आप पुराने ब्राउज़र और उनकी कमियों के बारे में चर्चा कर रहे हैं। उस सवाल से कोई लेना देना नहीं था। – deweydb

यह वही है जो वे करना चाहिए।

इनलाइन तत्वों के बीच की जगह शब्दों के बीच की जगहों से अलग नहीं है।

यदि आप इसे नहीं चाहते हैं, तो ब्लॉक तत्वों का उपयोग करें, या फ़ॉन्ट आकार को शून्य पर सेट करें।

स्रोत

2013-05-22 17:33:28 SLaks

बिल्कुल, जब आप ' बी 'की उम्मीद करते हैं, तो आप' अब 'की उम्मीद करते हैं और' ab 'नहीं लिखते हैं और जब आप" हैलो वर्ल्ड "लिखते हैं और" हैलो वर्ल्ड "नहीं देखते हैं, तो" हैलोवर्ल्ड " –

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

ठीक है, उनके बीच रिक्त स्थान हैं!

एक फिक्स के लिए, मूल तत्व में font-size: 0 का उपयोग करने का प्रयास करें।

स्रोत

2013-05-22 17:34:41 gustavohenke

फ़ॉन्ट आकार को शून्य पर सेट करने से सफेद स्थान को हटाने का एक बेहतर तरीका है (क्योंकि उस विधि के अप्रिय साइड इफेक्ट्स हैं)। आप इसके बजाए शब्द-अंतर कर सकते हैं:

<!DOCTYPE html> 
<html lang="en"> 
<head> 
<meta charset="utf-8"> 
<style> 

section { 
    word-spacing:-.25em; /* hide whitespace nodes in all modern browsers (not for webkit)*/ 
    display:table;/* Webkit Fix */ 
} 

div { 
    width: 100px; 
    height: 40px; 
    background: #e7e7e7; 
    padding: 10px; 
    display:inline-block; 
    word-spacing:0; /* reset from parent*/ 
} 

</style> 
</head> 
<body> 
<section> 
    <div>one</div> 
    <div>two</div> 
    <div>three</div> 
</section>   
</body> 
</html>

स्रोत

2013-08-26 12:53:14

यह समाधान है।

<style> 
    * { 
    border:0; 
    margin:0; 
    padding:0; 
    box-shadow:0 0 1px 0px silver; 
    } 
    .foo { 
    width: 100%; 
    } 
    .bar { 
    width: 50%; 
    float:left; 
    text-align: center; 
    } 
    </style> 
    <div class="foo"> 
     <div class="bar"> 
      ...a new customer 
     <!-- the whitespace between the following divs affects rendering - why? --> 
     </div> <div class="bar"> 
      ...an existing customer 
     </div> 
    </div>

स्रोत

2013-08-26 13:51:45

क्यों आधुनिक ब्राउज़रों अभी भी इनलाइन ब्लॉक के बीच रिक्त स्थान रखूँ अगर वहाँ खाली स्थान के

उत्तर

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