Я хочу центрировать div внутри div, который имеет высоту 100%. в основном основной div приходит перед сайтом. Я загружаю изображение, чтобы вы могли лучше понять, что я хочу делать.центрирование div вертикально внутри другого div с высотой 100%
При использовании CSS Flexbox вариант, можно просто добиться того, что при отображении контейнера в качестве flex коробки и выровнять внутренний DIV в середине (по горизонтали и по вертикали) следующим образом:
#intro {
height: 100%; /* Or 100vh */
display: flex;
align-items: center; /* Align the inner div vertically */
justify-content: center; /* Align the inner div horizontally */
}
В этом примере, align-items и justify-content WO uld делает внутренний дисплей div в середине #intro, вертикально и горизонтально.
Добавляя префиксы поставщиков, он также должен работать на IE 10. (Я использовал Autoprefixer в демо).
Однако для того, чтобы поддерживать старые браузеры дают этот подход попробовать (взглянуть на Vertical Alignment секции):
Правильно, есть ли у меня альтернатива? Это работает на IE 9? – Fede
@Fede Проверьте обновление, пожалуйста. –
возможный дубликат [Что лучший способ Центрирование Div вертикально с помощью CSS] (http://stackoverflow.com/questions/396145/whats-the-best-way-of-centering-a-div-vertically-with-css) –
Также посмотрите: http : //stackoverflow.com/questions/14113676/vertically-center-a-div-with-variable-height-within-a-div-that-is- 100-of-the-vi? Rq = 1 –
К сожалению, для этого вам нужно установить фиксированную высоту на контейнере (почему, браузеры, почему ???). –