如何定位一个 div 在浏览器的右下角?

我试图把我的 div 与一些注释在屏幕的 右下角位置,这将显示所有的时间。

我用了以下 css:

#foo
{
position: fixed;
bottom: 0;
right: 0;
}

它在 Chrome 3和 Firefox 3.6中运行良好,但 IE8糟透了... ..。

怎样才是合适的解决办法呢?

268967 次浏览

Try this:

#foo
{
position: absolute;
top: 100%;
right: 0%;
}

This snippet works in IE7 at least

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>Test</title>
<style>
#foo {
position: fixed;
bottom: 0;
right: 0;
}
</style>
</head>
<body>
<div id="foo">Hello World</div>
</body>
</html>

I don't have IE8 to test this out, but I'm pretty sure it should work:

<div class="screen">
<!-- code -->
<div class="innerdiv">
text or other content
</div>
</div>

and the css:

.screen{
position: relative;
}
.innerdiv {
position: absolute;
bottom: 0;
right: 0;
}

This should place the .innerdiv in the bottom-right corner of the .screen class. I hope this helps :)