У меня есть div, и я хочу выровнять по центру этого div нескольких изображений. Все изображения имеют одинаковую высоту и ширину 16 пикселей. Проблема в том, что я могу либо центрировать их, либо иметь дополнительное пространство ниже, но когда я использую дисплей: блок для его удаления, они снова выравниваются влево. Здесь мой код:
div, который должен содержать изображения:
.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;
}
Вышеприведенный класс обладает свойствами, необходимыми в целом. Поэтому я хочу создать класс для элементов img, чтобы их можно было выровнять один рядом друг с другом и все вместе выровнять по горизонтали.
Любые рабочие предложения?!:)
Плавающий элемент уровня блока будет толкать его влево или вправо. "display: inline-block" в IMG. И удалите операторы float и position. Затем "text-align: center" для контейнера div.
Я использовал div как поддельный img, но он должен работать одинаково.
<div class="Image">FIRST</div>
<div class="Image">SECOND</div>
.ImageHolder{
text-align:center;
}
.Image{
display:inline-block;
}