получить высоту для позиционирования div в абсолютном режиме - PullRequest
1 голос
/ 02 июня 2009

, так как на мой последний вопрос был дан немедленный ответ .. я решил опубликовать новый, который убирает все мои волосы, XD

это проблема ..

У меня есть дизайн с абсолютным позиционированием div, который имеет прозрачный png и простой якорь ... просто так.

<div class="buyfloat">
      <img src="img/buy.png" />
</div>

так что ... мне нужно, чтобы этот div.buyfloat находился в абсолютной позиции ... не двигался ... не прыгал, не выцветал ... мне просто нужно его в 200px от самого нижнего края страницы ... потому что мне нужно это только наверху моего нижнего колонтитула .. и поскольку высота страниц увеличивается или уменьшается .. я не могу использовать верхний селектор.

хорошо .. "используйте дно!" Вы можете сказать ... да, сэр, я пытался ... но по какой-то причине ... нижний селектор использует высоту окна (видимая часть) вместо всего этого ... и ... если я прокручиваю страницу вниз ... изображение прямо в середине страницы.

.buyfloat{
    width:333px;
    height:135px;
    position:absolute;
    left:10px;
    bottom:200px; /**   not working         **/
    margin:5px auto 0 auto;
    z-index:99;
}

Я ищу какой-то javascript (я думаю, что видел его когда-то назад), который дает мне рост прямо на CSS ... но если у вас есть какое-то другое и более простое решение ... я весь слух!

заранее спасибо.

Ответы [ 2 ]

3 голосов
/ 02 июня 2009

Имейте в виду, что «position: absolute» на самом деле относится к первому предку элемента, который имеет значение позиции, отличное от «static» (см. Пункт 4 в http://www.w3.org/TR/CSS2/visudet.html#containing-block-details). Так что, возможно, у вас есть такая ситуация и «основание» измеряет какой-то другой элемент, а не html / body.

2 голосов
/ 02 июня 2009

Во-первых, единственный способ, которым JS работает в CSS, - это «выражение», то есть только IE, во-вторых, это потребует от ваших пользователей включения JS.

pos: abs удаляет элемент из обычного макета и размещает его относительно ближайшего абсолютного или относительного родителя. Если вы находитесь в строгом или переходном xhtml, нижняя будет абсолютно работать, если вы просто сделаете тело относительно:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
    <head>
        <style>
        body {height: 9000px;position:relative;}
        #a {position:absolute; bottom:0px;}
        </style>
    </head>
    <body>
    <div id="a">bottomDweller</div>
    </body>
</html>
...