css - абсолютная позиция сверху, горизонтально центрированный div - PullRequest
Новая
       42

css - абсолютная позиция сверху, горизонтально центрированный div

9 голосов
/ 11 мая 2011

Я посмотрел результаты Google googol, не найдя ничего подходящего.

Мне нужно, чтобы мой div (высота 333 пикселя, ширина 550 пикселов) был отцентрирован по горизонтали и всегда находился на расстоянии 275 пикселей отТоп.Каждый раз, когда я пытаюсь сделать это, он просто исчезает.

Ответы [ 3 ]

26 голосов
/ 11 мая 2011

Если div должен сидеть сверху, вы должны использовать position:absolute.В противном случае ответ от @sdleihssirhc должен сработать.

Пример с позиционированием 

#middlebox
{
    position:    absolute;
    top:         275px;
    left:        50%;    /* move the left edge to the center … */
    margin-left: -275px; /* … and move it to the left half the box’ width. */
    z-index:     9999;   /* Try to get it on top. */
}

Используйте инструменты типа Dragonfly или Firebug для проверки свойствесли он все еще исчезает.

0 голосов
/ 11 мая 2011

Если вы не думаете о статическом позиционировании, я не думаю, что вам вообще нужно было бы использовать абсолютное позиционирование. Попробуйте это: 

<html>
<head>
<title>Test</title>
</head>
<body>
<div style="width:550px; height:333px; background-color:orange; margin: 275px auto">
Is this what you want?
</div>
</body>
</html>
0 голосов
/ 11 мая 2011

В зависимости от содержимого и контекста, вы можете просто установить поле этого div: 

margin: 275px auto 0;
...