बूटस्ट्रैप 3 में 5 बराबर कॉलम कैसे बनाएं?

Question

मैं एक चयन लिंक बना रहा हूं जिसमें 10 कंटेनर हैं। और मैं चाहता हूं कि उन्हें 5 बराबर कॉलम में विभाजित करें। अब मेरी समस्या यह है कि मैं कॉलम की चौड़ाई का विस्तार करना चाहता हूं। मतलब है कि मेरे माता-पिता पंक्ति में container कक्षा नहीं है।

<div id="categories-selections"> 
    <div class="col-md-2 no-padding"> 
     <img src="public/images/cat1.png" class="img-responsive" /> 
    </div> 
    <div class="col-md-2 no-padding"> 
     <img src="public/images/cat2.png" class="img-responsive" /> 
    </div> 
    <div class="col-md-2 no-padding"> 
     <img src="public/images/cat3.png" class="img-responsive" /> 
    </div> 
    <div class="col-md-2 no-padding"> 
     <img src="public/images/cat4.png" class="img-responsive" /> 
    </div> 
    <div class="col-md-2 no-padding"> 
     <img src="public/images/cat5.png" class="img-responsive" /> 
    </div> 
    <div class="col-md-2 no-padding"> 
     <img src="public/images/cat6.png" class="img-responsive" /> 
    </div> 
    <div class="col-md-2 no-padding"> 
     <img src="public/images/cat7.png" class="img-responsive" /> 
    </div> 
    <div class="col-md-2 no-padding"> 
     <img src="public/images/cat8.png" class="img-responsive" /> 
    </div> 
    <div class="col-md-2 no-padding"> 
     <img src="public/images/cat9.png" class="img-responsive" /> 
    </div> 
    <div class="col-md-2 no-padding"> 
     <img src="public/images/cat10.png" class="img-responsive" /> 
    </div> 

</div> 

यहाँ उत्पादन होना चाहिए:

और यहाँ है कि मैं क्या है:

सभी लोग है कि मुझे आशा है कि

यहाँ मेरी नमूना कोड मेरी मदद कर सकते हैं। https://jsfiddle.net/mk7bdyey/

Answer 1

इन-लाइन सीएसएस डाल सकता है तुम बस सब एक साथ

.col-xs-15, 
.col-sm-15, 
.col-md-15, 
.col-lg-15 { 
    position: relative; 
    min-height: 1px; 
    padding-right: 10px; 
    padding-left: 10px; 
} 

इसके बाद आप विभिन्न मीडिया क्वेरी के मामले में नए वर्गों की चौड़ाई परिभाषित करने की जरूरत एक नया स्तंभ बना सकते हैं।

.col-xs-15 { 
    width: 20%; 
    float: left; 
} 
@media (min-width: 768px) { 
.col-sm-15 { 
     width: 20%; 
     float: left; 
    } 
} 
@media (min-width: 992px) { 
    .col-md-15 { 
     width: 20%; 
     float: left; 
    } 
} 
@media (min-width: 1200px) { 
    .col-lg-15 { 
     width: 20%; 
     float: left; 
    } 
} 

तो आप सिर्फ इस

<div class="row"> 
    <div class="col-md-15 col-sm-3"> 
    ... 
    </div> 
</div> 

Answer 2

बाएं से गद्दी समायोजित करें और सही div करने के लिए अपने आवश्यकता के अनुसार जिसमें आप id="categories-selections" दे दिया है:

यहाँ नमूना बेला है। आप की तरह style="padding-left:30px; padding-right:30px;"