Căn chỉnh nhiều hình ảnh theo chiều ngang ở giữa div

Question

Tôi có một div và tôi muốn căn chỉnh ở giữa của nhiều hình ảnh div đó. Tất cả các hình ảnh có cùng chiều cao và chiều rộng là 16px. Vấn đề là tôi có thể là trung tâm của họ và có thêm không gian bên dưới nhưng khi tôi sử dụng display: block để loại bỏ nó, chúng được căn chỉnh sang bên trái một lần nữa. Dưới đây là mã của tôi:

div mà tôi muốn để chứa các hình ảnh:

.cell{ 
    position: relative; 
    float: left; 
    width: 300px; 
    min-height: 22px; 
    border-bottom: 1px solid #000; 
    border-right: 1px solid #000; 

    line-height: 22px; 
    font-family: Arial, Verdana; 
    font-size: 12px; 
    color: #000; 
    text-decoration: none; 
    text-align: center; 

    margin-bottom: 2px; 
    margin-right: 2px; 
} 

Lớp trên có các thuộc tính cần thiết nói chung. Vì vậy, tôi muốn tạo một lớp cho các phần tử img để chúng có thể được căn chỉnh một bên cạnh nhau và tất cả đều được căn chỉnh theo chiều ngang.

Bất kỳ đề xuất làm việc nào ?! :)

Answer 1

Làm nổi mục cấp khối sẽ đẩy nó sang trái hoặc sang phải. "display: inline-block" trên IMG. Và loại bỏ các báo cáo phao và vị trí. Sau đó, "text-align: center" cho div vùng chứa.

http://jsfiddle.net/B6Jsy/

tôi đã sử dụng một div như một img giả nhưng nó phải làm việc như nhau.

Answer 2

<div class="Image">FIRST</div> 
<div class="Image">SECOND</div> 

.ImageHolder{ 
text-align:center; 
} 

.Image{ 
display:inline-block; 
}