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

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

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>

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.

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 AndyAndy 5251 gold badge7 silver badges18 bronze badges
Add a ment  | 

2 Answers 2

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>

发布者:admin,转转请注明出处:http://www.yc00.com/questions/1745175842a4615187.html

相关推荐

发表回复

评论列表(0条)

  • 暂无评论

联系我们

400-800-8888

在线咨询: QQ交谈

邮件:admin@example.com

工作时间:周一至周五,9:30-18:30,节假日休息

关注微信