javascript - obtain height to position a div in absolute mode

as my last question was answered inmediatly.. i decided to post a new one which is taking all my hair away, XD

this is the problem..

i have a design with an absolute positioned div.. which has a transparent png and a simple anchor... just like this.

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

so.. i need this div.buyfloat positioned at an absolute position... not moving around.. no jumping no fading.. i just need it at 200px from the very bottom of the page... because i need it just on the top of my footer.. and as the heigh of the pages increases or decreases.. i can´t use top selector.

well.. "use bottom!" you may say.. yes sir i tried.. but for some kind of reason.. the bottom selector uses the window height (visible part) instead the whole thing.. and.. if i scroll the page down.. the image is right in the middle of the page.

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

i'm looking for some javascript (i think i saw one sometime ago) that gives me the body height right on the css.. but if you have any different and easier solution.. i'm all ears!

thanks in advance.

as my last question was answered inmediatly.. i decided to post a new one which is taking all my hair away, XD

this is the problem..

i have a design with an absolute positioned div.. which has a transparent png and a simple anchor... just like this.

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

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

i'm looking for some javascript (i think i saw one sometime ago) that gives me the body height right on the css.. but if you have any different and easier solution.. i'm all ears!

thanks in advance.

Share Improve this question edited Jun 5, 2009 at 2:25 Nicolas Dumazet 7,23128 silver badges36 bronze badges asked Jun 2, 2009 at 16:15 Andy 5251 gold badge7 silver badges18 bronze badges

Add a ment |

2 Answers 2

Sorted by: Reset to default 3

Bear in mind that "position: absolute" is actually relative to the first ancestor of the element that has a position value other than "static" (see point 4 in http://www.w3/TR/CSS2/visudet.html#containing-block-details). So maybe you have this situation and the "bottom" is measuring from some other element rather than html/body.

First off, the only way JS works in CSS is via "expression" which is IE only, secondly this would require your users also had JS turned on.

pos:abs removes the element from normal layout and places it with respect to the nearest absolute or relative parent. If you're in strict or transitional xhtml, bottom will absolutely work if you just make the body relative too:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3/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>

科技改变生活-雨落星辰 - 所有的伟大,都源于一个勇敢的开始

javascript - obtain height to position a div in absolute mode - Stack Overflow

2 Answers 2

与本文相关的文章

评论列表(0)