मैं कैसे रिक्ति उपयोगिता वर्गों बूटस्ट्रैप 4 पर

Question

इस article में प्रयोग करते हैं मैं बूटस्ट्रैप 4 रिक्ति उपयोगिता वर्गों को देखा और वह className

<div class="row"> 
    <div class="col-sm-6 m-b-lg"> 
     <!-- column-small-50%, margin-bottom-large --> 
    </div> 
</div> 

में MB-एलजी का उपयोग करता है लेकिन जब मैं के साथ meteorjs पर इसका इस्तेमाल कुछ नहीं प्रतिक्रिया हो । क्या मुझे कुछ या प्लगइन याद आ रही है?

 <div className="container-fluid"> 
      <div className="col-xs-6 col-xs-offset-3 m-t-lg"> 
       <h1 className="text-xs-center"> Login </h1> 
       <form> 
        <div className="form-group"> 
         <input type="email" className="form-control" id="inputEmail" placeholder="Email"/> 
        </div> 
        <div className="form-group"> 
         <input type="password" className="form-control" id="inputPassword" placeholder="Password"/> 
         <p className="text-xs-center"><a href="/signup"> Forgot your email or password?</a></p> 
        </div>  
        <div className="form-group"> 
         <button className="btn btn-primary btn-block" type="submit"> Login </button> 
         <p className="text-xs-center"> New to Arcademy? <a href="/signup"> Sign up now.</a></p> 
        </div> 
       </form> 
      </div> 
     </div> 

Answer 1

Spacing (बूटस्ट्रैप v4 अल्फा) दस्तावेज़ीकरण देखें।

कक्षाएं प्रारूप का उपयोग कर नाम हैं: {property}-{sides}-{size}

कहाँ आकार में से एक है: * 0 - वर्गों है कि खत्म करने के लिए margin या padding0 * 1 को निर्धारित कर उसे - कक्षाओं के लिए (डिफ़ॉल्ट रूप से) कि कक्षाएं किको मार्जिन या पैडिंग सेट के लिए (डिफ़ॉल्ट रूप से) - वर्गों कि $spacer-x * 1.5 या $spacer-y * 1.5 * 3 को मार्जिन या पैडिंग सेट के लिए ( डिफ़ॉल्ट रूप से) - मार्जिन या $spacer-x या $spacer-y * 2 को गद्दी सेटया $spacer-y * 3।

तो m-t-lg के बजाय m-t-3 का उपयोग करें।

Answer 2

असल में 0 से 3 मीट्रिक टन -0, एमटी -1, एमटी -2, या एमटी-3

Answer 3

अद्यतन करने के लिए अपने ही काम करता है 2018 बूटस्ट्रैप 4

बूटस्ट्रैप 4 spacing utils have changed मूल के बाद से जवाब। अब वाक्य रचना बस है:

• मार्जिन: मीटर {पक्षों} - {} आकार
• गद्दी: p {पक्षों} - {} आकार

उदाहरण ..

mb-2 = मार्जिन नीचे 2 रिक्ति इकाइयों
m-0 = कोई मार्जिन
pt-3 = गद्दी शीर्ष 3 रिक्ति इकाइयों
p-1 = गद्दी सभी पक्षों 1 रिक्ति इकाई

वहाँ अब कर रहे हैं 6 आकार (0-6) कि मानक 1rem स्पेसर इकाई के एक हिस्से का प्रतिनिधित्व करते हैं।साथ ही, x- अक्ष (बाएं/दाएं) और y- अक्ष (ऊपर/नीचे) utils जोड़ा गया है:

my-2 = मार्जिन शीर्ष & नीचे 2 रिक्ति इकाइयों
mx-0 = कोई मार्जिन & दाएँ से बाएँ
px-3 = गद्दी छोड़ दिया & सही 3 रिक्ति इकाइयों

और, रिक्ति utils अब उत्तरदायी हैं। जब कोई ब्रेकपॉइंट उपयोग नहीं किया जाता है तो सबसे छोटा xs ब्रेकपॉइंट अंतर्निहित होता है।

• मार्जिन: मीटर {पक्षों} - {ब्रेकप्वाइंट} - {आकार}
• गद्दी: p {पक्षों} - {ब्रेकप्वाइंट} - {आकार}

mt-md-2 = मार्जिन शीर्ष 2 रिक्ति इकाइयों, md (और ऊपर)
py-sm-0 = पर कोई गद्दी शीर्ष & नीचे, पर sm (और ऊपर)

012,

Bootstrap 4 Spacing Utils Demo