У меня есть всплывающее окно, которое содержит форму ASP.NET, щелкните ссылку "Запросить информацию" и появится форма.
Однако страницы, на которых есть ссылка "Запросить информацию", чтобы вызвать всплывающее окно, содержат много контента, поэтому для просмотра ссылки требуется прокрутка.
Мне нужно, чтобы div всегда центрировался, если пользователь прокручивает, чтобы читать содержимое, иначе, если они не будут прокручиваться, всплывающее окно по-прежнему появляется на экране.
div позиционируется абсолютно, вся ширина страницы 960px с пометкой 0 auto.
Если div имеет фиксированную ширину и высоту, используйте: (если ширина = 120 пикселей и высота = 80 пикселей)
position: fixed;
top: 50%;
left: 50%;
margin-left: -60px; /* negative half of the width */
margin-top: -40px; /* negative half of the height */
Использовать позицию: исправлено; для этого используйте 0 для верхнего, левого, правого и нижнего и дайте div display: table-cell; также, например, установка text-align: center; и выравнивание по вертикали: среднее; сделают все внутри внутри ровно посередине, без пиксельных точных хаков, таких как отрицательные поля.
Если ваш popup div имеет фиксированный размер, вы можете использовать этот CSS:
position: fixed;
left: 0;
top: 0;
right: 0;
bottom: 0;
margin: auto; /* this requires a fixed size */
В противном случае вам придется играть с дисплеем: table-cell; и т.п.
Это то, что вы пытаетесь сделать? http://jsfiddle.net/Hrwf8/
Ключ здесь состоит в том, чтобы установить левый и верхний стили на 50% и установить margin-left и top на отрицательное количество половины ширины и высоты div. Это, конечно, требует, чтобы у вас был фиксированный размер для вашего div.
В вашем CSS:
.ClassCenter {
position: absolute;
left: 50%;
top: 50%;
}
Источник: http://demo.tutorialzine.com/2010/03/centering-div-vertically-and-horizontally/demo.html