По центру выровнять div, который имеет float: left

Question

По центру выровнять div, который имеет float: left

0

У меня есть 3 изображения, которые находятся в одной строке и плавают влево, но я также хотел бы сосредоточить их. Я попытался использовать margin: 0px auto; но он ничего не делает. Какие-либо предложения?

CSS:

#boxes .box {
    width:370px;
    height:241px;
    float: left;
    margin: 0px auto;
    background-image:url(../imgs/box_front.png);
    background-repeat:no-repeat;
    background-color: #FFF;

}

Mr. Alien 21 окт. 2013, в 11:39

Источник

Теги:

html

css

background-image

css-float

4 ответа

1

Нельзя центрировать плавающие предметы. Одна из вещей, которую вы можете сделать, - сделать элементы inline-block и присвоить свойству text-align: center их родителям. Пример в Интернете: http://jsfiddle.net/8HPWU/

skip405 21 окт. 2013, в 07:38

0

Добавить этот CSS

#boxes .box {
    width:370px;
    height:241px;
    float: left;
    margin: 0px auto;
    background-image:url(../imgs/box_front.png);
    background-repeat:no-repeat;
    background-position:center center;
    background-color: #FFF;

}

Dinesh Kanivu 21 окт. 2013, в 07:12

0

Вы должны выровнять по центру к вашему родительскому DIV, который #boxes не к изображению. Попробуй это:

#boxes{
margin: 0 auto;
text-align: center;
}

Bhojendra Nepal 21 окт. 2013, в 06:16

Ещё вопросы

Mr. Alien · Accepted Answer · 2013-10-21T06-57-00.000Z

Из вашего селектора я могу понять, что поля, которые размещены слева, вложены внутри элемента с идентификатором #boxes, поэтому, если вы можете, назначьте некоторую фиксированную ширину в #boxes и чем используйте margin: auto;

#boxes {
   width: 800px; /* You need to set this */
   margin: auto;
}

демонстрация

о, здорово, это очень помогло, спасибо :)
@iNeed_anAnswer Добро пожаловать, я также предоставил демо, вы можете изменить размер рамки скрипки, чтобы увидеть ожидаемый результат, также не забудьте очистить поплавки :)