2016-03-31 13 views
5

मेरे पास एक पृष्ठ पर कुछ आइटम वाला एक PHP पृष्ठ है। मैं बड़े मॉनीटर पर तीन कॉलम चाहता हूं लेकिन यह वही करता है। एक कॉलम पहले पृष्ठ पर दो कॉलम छोड़ देता है। ऐसा नहीं होता है जब चार कॉलम होते हैं, लेकिन मुझे तीन चाहिए।बूटस्ट्रैप कॉलम दो स्थानों को छोड़ दें

कॉलम पर कोई अन्य शैली नहीं है तो यह ऐसा क्यों करता है?

This is what "insperct element" reveals.

उत्तर

1

उसके तत्वों ऊंचाई के बारे में। आप पंक्ति वर्गीकृत divs का पालन कर सकते हैं।

<div class="row"> 
    <div class="col-md-4 col-sm-6 col-xs-12">...</div> 
    <div class="col-md-4 col-sm-6 col-xs-12">...</div> 
    <div class="col-md-4 col-sm-6 col-xs-12">...</div> 
</div> 
<div class="row"> 
    <div class="col-md-4 col-sm-6 col-xs-12">...</div> 
    <div class="col-md-4 col-sm-6 col-xs-12">...</div> 
    <div class="col-md-4 col-sm-6 col-xs-12">...</div> 
</div> 
+0

यह अच्छा नहीं है क्योंकि जब दो कॉलम होने चाहिए तो हमेशा एक कॉलम के साथ दो कॉलम और एक पंक्ति के साथ एक पंक्ति होती है। –

+0

ताकि आप सभी _.item_ वर्गीकृत divs के लिए समान ऊंचाई मान देने का प्रयास कर सकें। आपके द्वारा संलग्न स्क्रीनशॉट ऐसा लगता है कि दूसरी वस्तु दूसरों की तुलना में लंबी है। ** शायद ऊंचाई की सेटिंग में _max-height_ – Tanbi

+1

के साथ उपयोग कर रहा है। धन्यवाद। –

3

Tanbi के सुझाव बूटस्ट्रैप दिशा निर्देशों के अनुसार अच्छा है, लेकिन अगर आप आइटम div के बीच .rowdiv जोड़ने के लिए उपयोग कर सकते हैं नहीं करना चाहती नीचे उल्लेख css

.col-md-4:nth-child(3n+3) + .col-md-4{clear:both;} 

मैं सुनिश्चित नहीं हूं लेकिन मुझे लगता है कि यह काम है।

+0

PERFECTION !! धन्यवाद! – spb

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