một div rộng với chiều rộng không giới hạn

Question

Tôi là một vấn đề lớn!

Bạn biết đấy, div mặc định width là 100% (của phụ huynh). Và nếu chiều rộng nội dung của nó lớn hơn 100% (100% = 1440px), thì div hiển thị nội dung theo nhiều dòng.

Bây giờ, nếu tôi muốn, div hiển thị nội dung của nó trong một dòng, tôi phải làm gì? xem mã đơn giản ::

<div> 
    <div>aaa</div> 
    <div>bbb</div> 
    <div>ccc</div> 
    <div>ddd</div> 
    ......(more than 100 other div, with unknown width) 
</div> 

LƯU Ý: Tôi không biết chiều rộng nội dung.

Tôi đã thử display: inline; và display: inline-block; và display: table;. họ không làm việc.

LƯU Ý 2: Tôi đã thử display: -moz-box;. Nó hoạt động, nhưng chỉ trong FIREFOX! Thanks ...

Answer 1

Cách đơn giản nhất là sử dụng white-space: nowrap vào phụ huynh, và display: inline-block trên trẻ em:

Xem:http://jsfiddle.net/4Yv83/

Tôi cũng đã thêm overflow-x: auto, bởi vì có lẽ bạn don't want this.

Answer 2

Chỉ cần nói cho văn bản bên trong div không được bọc.

div { 
    white-space: nowrap; 
} 

Answer 3

một vài năm trôi qua nhưng ... Tôi nghĩ sẽ tốt hơn nếu đặt tràn để ẩn, vì chúng tôi không cần hiển thị tất cả các phần tử con cùng một lúc. chúng tôi sử dụng kiểu tạo kiểu này trong các thành phần giống như hình thu nhỏ. vì vậy tôi đề nghị đặt "overflow: hidden" thành phần tử cha.

/* for parent element */ 
overflow: hidden;