вертикальное выравнивание div с динамически ростом и шириной тела

Question

вертикальное выравнивание div с динамически ростом и шириной тела

0

У меня есть div с фиксированной шириной и высотой, установленный на экране.

Я хочу выровнять это по вертикали посередине, но тело изменит высоту, так как разрешение экрана изменится, его полноэкранный макет, высота и ширина будут меняться по мере уменьшения или увеличения разрешения экрана зрителя.

В основном у меня есть.

<div id="center">
                <ul id="wrap">
                    <li><a href="#">In&iacute;cio</a></li>
                    <li><a href="#">Historico</a></li>
                    <li><a href="#">Comissao Organizadora</a></li>
                </ul>
            </div><!--menu-->

и я попытался использовать margin-top:50%, margin-bottom:50% но без успеха.

PlayMa256 13 дек. 2013, в 04:03

Источник

1

Пожалуйста, обновите ваш пробный код. В приведенном выше коде нет тега div, как вы упомянули
Nandu 13 дек. 2013, в 02:29
0

Вы хотите, чтобы div центрировался на странице независимо от ширины документа / страницы?
mdesdev 13 дек. 2013, в 02:34
0

опубликуйте свой код, пожалуйста, лучше, если он есть в jsfiddle.net
Amarnath Balasubramanian 13 дек. 2013, в 02:39
0

Попробуйте #center { position: fixed; width: 500px; height: 500px; top: 50%; left: 50%; margin: -250px 0 0 -250px; } поля всегда составляют половину значения ширины / высоты.
mdesdev 13 дек. 2013, в 02:40

Показать ещё 2 комментария

Теги:

html

css

1 ответ

Ещё вопросы

Пожалуйста, обновите ваш пробный код. В приведенном выше коде нет тега div, как вы упомянули
Вы хотите, чтобы div центрировался на странице независимо от ширины документа / страницы?
опубликуйте свой код, пожалуйста, лучше, если он есть в jsfiddle.net
Попробуйте #center { position: fixed; width: 500px; height: 500px; top: 50%; left: 50%; margin: -250px 0 0 -250px; } поля всегда составляют половину значения ширины / высоты.

Sender · Accepted Answer · 2013-12-13T00-38-00.000Z

Проверьте эту демонстрационную версию jsfiddle

<div id="center">
    <ul id="wrap">
        <li><a href="#">In&iacute;cio</a></li>
        <li><a href="#">Historico</a></li>
        <li><a href="#">Comissao Organizadora</a></li>
    </ul>
</div>

Стиль CSS

html, body, #center {
    height: 100%;
    position:relative;
    margin:0px;
    padding:0px;
}
#center #wrap {
    margin:0px;
    padding:0px;
    height: 50%;
    position: absolute;
    top: 50%;
    left:40%;
}