nội dung trung tâm nền tảng zurb trong lưới

Question

Tôi đang cố gắng căn giữa hình ảnh theo chiều ngang thành cột zurb nhưng có vẻ như không thể. Tôi đã thử tất cả mọi thứ, tìm kiếm ở khắp mọi nơi, nhưng tôi không thể làm cho nó hoạt động.

Đây là mã của tôi:

<div class="row"> 
    <div class="twelve columns"><br /> 
     <img src="img_06.jpeg" alt="slide image"> 
    </div> 
</div> 

hiện hình ảnh phong cảnh là alright trên lưới 12 cột, nhưng khi một hình ảnh chân dung đến cùng nó là ở phía bên trái của lưới điện. Nếu tôi cho nó một đệm 25% nó đi đến trung tâm, nhưng tôi đang sử dụng php để kéo tất cả các hình ảnh từ một thư mục và tạo mã trên bay, vì vậy tôi không thể có 25% đệm trên tất cả các hình ảnh (cảnh quan thu nhỏ).

Cảm ơn

Answer 1

Sửa tháng 11 năm 2015: Trong Foundation 6 séc ra Typography Helpers

---

Sửa Tháng Tư 2014: Trong Foundation 5 séc ra Utility classes.

---

câu trả lời gốc:

Sử dụng các lớp text-trung tâm.

<div class="row"> 
    <div class="twelve columns text-center"><br /> 
     <img src="img_06.jpeg" alt="slide image"> 
    </div> 
</div> 

Nguồn: https://github.com/zurb/foundation/pull/224

Answer 2

Hãy thử thêm lớp trung tâm.

.five.columns.centered 

Answer 3

Sử dụng nền tảng 4:

HTML:

<div class="row"> 
    <div id="wrap-img" class="large-12 columns"><br /> 
     <img src="img_06.jpeg" alt="slide image"> 
    </div> 
</div> 

CSS:

#wrap-img img { margin: 0 auto; } 

Answer 4

Cách duy nhất tôi có thể nhận được một hình ảnh làm trung tâm trong Founda tion 4 là thay đổi để hiển thị: khối; cho img thay vì hiển thị: inline-block;

Answer 5

Chỉ cần thêm "trung tâm văn bản" lớp học