Изображения в центре Div с CSS - PullRequest
Новая
       16

Изображения в центре Div с CSS

0 голосов
/ 28 ноября 2011

Привет, у меня есть div, который оборачивает изображения. Ширина этого DIV может измениться, поэтому я установил его на 100% 

<div id="wrapperDiv"></div>

Внутри у меня есть изображения / миниатюры, сдвинутые влево с полемили справа и снизу изображения. 

margin:0 10px 10px auto;

В зависимости от окна div-оболочки, иногда я помещаю по 10 миниатюрных изображений в строку, а иногда и меньше.

Мне нужно, чтобы изображения былипо центру, чтобы пространство слева и справа было одинаковым.

Можно ли сделать это с помощью CSS?

Ответы [ 2 ]

2 голосов
/ 28 ноября 2011

Я бы попробовал добавить дополнительный div-обертку со следующим CSS: 

wrapper-inside {
    margin:0 10%;
    width:90%;
}

Или даже проще (без дополнительного div): 

wrapperDiv {
    padding:0 10%;
}

РЕДАКТИРОВАТЬ:

Я думал об этом по дороге в супермаркет и понял, что это не идеально центрирует изображения - предложение Вируццо - единственное, которое работает: 

<head>
    <style type="text/css">
    div.wrapper {
        text-align:center;
    }
    </style>
    </head>
    <body>
        <div class="wrapper">
            <img width="200" height="120">
            <img width="200" height="120">
            <img width="200" height="120">
            <img width="200" height="120">
            <img width="200" height="120">
            <img width="200" height="120">
            <img width="200" height="120">
            <img width="200" height="120">
            <img width="200" height="120">
            <img width="200" height="120">
            <img width="200" height="120">
            <img width="200" height="120">
            <img width="200" height="120">
            <img width="200" height="120">
            <img width="200" height="120">
            <img width="200" height="120">
            <img width="200" height="120">
            <img width="200" height="120">
            <img width="200" height="120">
        </div>
    </body>
</html>
0 голосов
/ 28 ноября 2011

Это должно помочь вам:

http://www.cssplay.co.uk/menus/centered.html

Тим

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...