Cách căn chỉnh các cột trong móng

Question

Cuối cùng tôi đã bắt đầu sử dụng nền tảng và nó rất tuyệt. Vì vậy, tôi đã được chỉ là thử nghiệm ra một ví dụ và tôi nhận thấy rằng nếu chỉ có hai cột liên tiếp nó trông như thế này:

Tôi đã có thể nghĩ rằng "Hộp B" có thể đã được bên cạnh "Box A ". Làm cách nào để căn chỉnh nó ở bên trái? Tôi đã không đọc quá nhiều tài liệu (như tôi nên), nhưng tôi nghĩ tôi sẽ hỏi.

Trong trường hợp bạn cần mã (mã được đưa ra khi bạn tải về nền tảng):

<div class="row"> 
    <div class="large-4 columns"> 
     <div class="panel"> 
      <p>BOX A</p> 
     </div> 
    </div> 
    <div class="large-4 columns"> 
     <div class="panel"> 
      <p>BOX B</p> 
     </div> 
    </div> 

</div> 

Cảm ơn,

Nick

Answer 1

Kiểm tra css của bạn cho class="row" và thêm {float:left;}

Answer 2

Điều này là do lưới nền tảng cơ sở phải thêm tối đa 12.

Các cột được tạo bằng cách sử dụng các lớp css: .small- #, .medium- #, và .large- #. Số # phải thêm tối đa là 12 vì Foundation sử dụng hệ thống lưới 12. Nguồn: http://scotch.io/tutorials/css/understanding-zurb-foundation-5s-grid-system

Thay đổi lớp học để lớn 6

Answer 3

Bạn có thể thêm lớp END để cột B để làm cho nó sắp xếp sang bên trái.

<div class="large-4 columns end"> 
    <div class="panel"> 
     <p>BOX B</p> 
    </div> 
</div> 

Nguồn: http://scotch.io/tutorials/css/understanding-zurb-foundation-5s-grid-system