Làm thế nào để làm đệm trên một dòng chất lỏng trong twitter bootstrap

Question

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

Bây giờ, khi tôi đệm trên wrapper nội bộ, tôi hy vọng padding có hiệu lực trên toàn bộ lưới! bên trong nó. Nhưng một tràn đang xảy ra (tôi nghĩ, padding đúng không hoạt động)

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

Thanh màu xanh dưới đây đại diện cho Header lớp. Hộp màu xanh lá cây, đại diện cho padding! Vì vậy, nó xảy ra bên trái nhưng không phải

Answer 1

.row-fluid là 100% chiều rộng. Bởi vì nó sử dụng bố cục hộp viền, bất kỳ phần đệm nào bạn đặt sẽ được thêm vào 100% đó. Xem http://paulirish.com/2012/box-sizing-border-box-ftw/. Tuy nhiên, thiết lập nó để sử dụng mô hình hộp nội dung có thể sẽ gây ra các vấn đề khác trong Bootstrap.

Cách khắc phục - thêm phần tử bên trong bằng phần đệm.

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

Answer 2

Tôi không thể nhìn thấy (hoặc phân biệt) từ bài đăng của bạn có gì sai, nhưng đây là phỏng đoán của tôi: Bằng cách đặt đệm vào yếu tố kích thước Bootstrap, bạn đã thay đổi chiều rộng của nó. Hãy thử đặt lề trên .Header thay vào đó.

Nếu điều này không giúp đỡ, xin vui lòng tạo một bản demo: http://jsfiddle.net/