Я могу выровнять div по горизонтали, и все содержимое выглядит красиво. Требуется вертикальное выравнивание div, не содержащего таблиц. Я попытался установить позиции полей на некоторые отрицательные значения внутри #container, но это сработало. Я знаю, что CSS еще не поддерживает это?
Вот моя разметка:
body
{
background: #777; /* gray */
text-align: center;
}
#container
{
margin: 0 auto;
width: 968px;
text-align: left;
}
#toptab
{
background: #f77; /* red */
height: 14px;
width: 968px;
}
#middletab
{
background: #7f7; /* green */
width: 968px;
}
#data
{
width: 948px; /* 948 for the box plus we need 20 more px to handle the padding */
padding-left: 10px;
padding-right 10px;
}
#bottomtab
{
background: #77f; /* blue */
height: 14px;
width: 968px;
}<div id="container">
<div id="toptab"></div>
<div id="middletab">
<div id="data">
The quick brown fox jumped over the big red bear.
The quick brown fox jumped over the big red bear.
The quick brown fox jumped over the big red bear.
The quick brown fox jumped over the big red bear.
The quick brown fox jumped over the big red bear.
The quick brown fox jumped over the big red bear.
The quick brown fox jumped over the big red bear.
The quick brown fox jumped over the big red bear.
The quick brown fox jumped over the big red bear.
The quick brown fox jumped over the big red bear.
The quick brown fox jumped over the big red bear.
The quick brown fox jumped over the big red bear.
</div>
</div>
<div id="bottomtab"></div>
</div>Запустите приведенный выше фрагмент и нажмите «Полная страница», чтобы увидеть, как он выглядит в настоящее время. В принципе, он отлично смотрится по горизонтали, но теперь мне нужно, чтобы он также находился по центру по вертикали на странице.
Элемент, который я хочу выровнять по вертикали, - это div #container. Эффект заставит весь div и все под div не только выровняться по горизонтали, но и по вертикали. Я знаю, что это возможно, и я знаю, что Энди Бадд опубликовал такое решение, но, похоже, оно не работает для меня.
