2015-04-06 25 views
7

Tôi muốn sử dụng toàn bộ chiều rộng trên các thiết bị xs và sm (bình chứa chất lỏng) nhưng chỉ là lớp chứa cho tất cả các thiết bị khác Cách tốt nhất để đặt thiết bị này vào vị trí nào? Tôi đã thử jasnys bootstrap trong đó có một lớp container trơn tru nhưng nó không trung tâm nội dung khi màn hình được trên một kích thước nhất định ...Thùng chứa chất lỏng Bootstrap trên thiết bị xs chỉ

+3

Bạn có nhận thấy nhu cầu này không? 'container' mất tự động bố cục" đóng hộp "trên các thiết bị' xs'. –

+0

Nó không hoàn toàn sử dụng chiều rộng toàn màn hình trên thiết bị xs tôi đã thử nghiệm nó, hành vi chứa chất lỏng không được nhìn thấy trên xs – AShah

+1

Cách dễ nhất là tạo truy vấn '@ media' tùy chỉnh và tùy chỉnh' lớp .container'. –

Trả lời

-4

bạn có thể thêm một bản sao của cùng một container và cấu hình nó có thể nhìn thấy chỉ trong kích thước bạn muốn với các lớp ẩn-xx và có thể nhìn thấy-xx như thế này:

<div class="container-fluid hidden-md hidden-lg"> 
    your content here 
</div> 

và điều này cho container bình thường:

<div class="container hidden-xs hidden-sm"> 
     your content here 
    </div> 
+0

sau đó bạn cần sao chép nội dung của mình mặc dù chứa cả hai định dạng (ví dụ: xs, sm vs md, lg) – ganders

+0

Sao chép nội dung không cần thiết. –

8

Ghi đè lên lớp container trong CSS của bạn và done của bạn :

/* XS styling */ 
@media (max-width: @screen-xs-max) { 
    .container { 
    width: inherit; 
    } 
} 

/* SM styling */ 
@media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) { 
    .container { 
    width: inherit; 
    } 
} 

Chỉ cần thay thế các biến Ít hơn bằng giá trị px tương ứng của bạn.

Các vấn đề liên quan