display: inline रीसेट करता है ऊंचाई और चौड़ाई

मैं कम से http://jsfiddle.net/GKnkW/2/display: inline रीसेट करता है ऊंचाई और चौड़ाई

एचटीएमएल उदाहरण बनाया है

<!DOCTYPE html> 
<html> 
<head> 
    <title>Test</title> 
</head> 
<body> 
     <div class="step">1</div>&nbsp; 
     <div class="step">2</div> 
     <br/><br/> 
     <div class="step1">3</div>&nbsp; 
     <div class="step1">4</div> 
</body> 
</html>

सीएसएस

.step 
{ 
    height:150px; 
    width:150px;  
    background:yellow; 
    display:inline; 
} 

.step1 
{ 
    height:150px; 
    width:150px;  
    background:yellow; 
}

मैं उनके मूल ऊंचाई के साथ कंधे से दो divs पक्ष प्रदर्शित करना चाहते हैं और चौड़ाई (सीएसएस में सेट) जैसे ही मैं डिस्प्ले जोड़ता हूं: सीएसएस में इनलाइन प्रॉपर्टी में यह पहले से परिभाषित ऊंचाई और चौड़ाई को ढीला लगता है। [# 1 और # 2 के साथ divs की जांच करें जो ढीली ऊंचाई और चौड़ाई सेटिंग]

क्या कोई पिन एक त्रुटि को इंगित कर सकता है जो मुझे लगता है कि यह अजीब व्यवहार के लिए काम कर रहा है या कामकाज है?

स्रोत

2011-04-22 N30

इनलाइन ऑब्जेक्ट्स में ऊंचाई या चौड़ाई नहीं है। आप उन्हें शुरू करने के लिए इनलाइन क्यों सेट कर रहे हैं? आप शायद उन्हें या तो इनलाइन-ब्लॉक का उपयोग करना चाहते हैं।

स्रोत

2011-04-22 20:05:45

इनलाइन वस्तु के व्यवहार के बारे में पता नहीं था। ज्ञान के लिए धन्यवाद। इनलाइन-ब्लॉक में डिस्प्ले प्रॉपर्टी को बदलना समस्या को हल करता है। – N30

डांग !! 11 मिनट से पहले जवाब स्वीकार नहीं कर सकता .. इसके बाद आपके उत्तर को स्वीकार किए जाने के रूप में चिह्नित किया जाएगा .. – N30

यह

एचटीएमएल करना चाहिए

<!DOCTYPE html> 
<html> 
<head> 
    <title>Test</title> 
</head> 
    <body> 
     <div class="step-section"> 
      <div class="step">1</div> 
      <div class="step">2</div> 
     </div> 
     <div class="step-section"> 
      <div class="step">3</div> 
      <div class="step">4</div> 
     </div> 
</body> 
</html>

सीएसएस

.step 
{ 
    margin:5px; 
    height:150px; 
    width:150px;  
    background: yellow; 
    float:left; 
} 

.step-section 
{ 
    clear:both; 
}

स्रोत

2011-04-22 20:16:04 Racter

बस कहा कि मैं एक ऐसी ही समस्या थी और सोचा कि यह एक जावास्क्रिप्ट/jQuery मुद्दा था। यह धागा मेरे लिए हल हो गया।

इनलाइन तत्वों की कोई चौड़ाई नहीं है, इसलिए आप इसे जेएस के माध्यम से सेट नहीं कर सकते हैं।

धन्यवाद।

यहां मेरी समस्या का एक लिंक यहां है।

Jquery and Jqueryui: set width not working after using resizable?

स्रोत

2013-03-24 01:14:14 noderman

इस का उपयोग करें:

display:inline-block;

स्रोत

2015-12-20 21:24:42

कृपया अपना उत्तर संपादित करें और समझाएं कि यह क्यों काम करता है। –

इनलाइन-ब्लॉक इसे इनलाइन रखता है, लेकिन इसे चौड़ाई और ऊंचाई जैसे ब्लॉक तत्व गुणों पर लेने की अनुमति देता है। –

display: inline रीसेट करता है ऊंचाई और चौड़ाई

उत्तर

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