ट्विटर बूटस्ट्रैप में तरल पंक्ति पर पैडिंग कैसे करें

Question

<div class="internal-wrapper row-fluid"> 
     <div class="Header span12"> 
       <div class="HeaderTitle span6"></div> 
       <div class="span6"></div> 
     </div> 
</div> 

अब, जब मैं आंतरिक-रैपर पर पैडिंग करता हूं, तो मुझे पूरे ग्रिड पर पैडिंग प्रभाव होने की उम्मीद है! इसके अंदर। लेकिन एक अतिप्रवाह हो रहा है (मुझे लगता है, सही गद्दी काम नहीं कर रहा)

.internal-wrapper { 
    padding-left: 30px; 
    padding-right: 30px; 
} 

नीले बार के नीचे Header वर्ग का प्रतिनिधित्व करता है। ग्रीन बॉक्स, पैडिंग का प्रतिनिधित्व करता है! तो, यह बायीं ओर हो रहा है लेकिन सही नहीं है

Answer 1

.row-fluid 100% चौड़ाई है। चूंकि यह सीमा-रेखा लेआउट का उपयोग कर रहा है, इसलिए आपके द्वारा डाला गया कोई भी पैडिंग उस 100% में जोड़ा जाता है। http://paulirish.com/2012/box-sizing-border-box-ftw/ देखें। हालांकि, सामग्री-बॉक्स मॉडल का उपयोग करने के लिए इसे सेट करने से शायद बूटस्ट्रैप में अन्य समस्याएं पैदा होंगी।

इसे कैसे ठीक करें - पैडिंग के साथ एक आंतरिक तत्व जोड़ें।

<div class="row-fluid"> 
    <div style="padding-left: 30px; padding-right: 30px;"> 
    ... 
    </div> 
</div> 

Answer 2

मैं आपकी पोस्ट से क्या गलत (या समझ सकता हूं) गलत नहीं है, लेकिन यहां मेरा अनुमान है: बूटस्ट्रैप आकार वाले तत्व पर पैडिंग डालकर, आपने इसकी चौड़ाई बदल दी है। मार्जिन डालने का प्रयास करें। इसके बजाय हैडर।

यदि यह मदद नहीं करता है, एक डेमो बनाएं: http://jsfiddle.net/