I am trying to place my div with some notes in the bottom right position of the screen which will be displayed all time.
I used following css for it:
#foo
{
position: fixed;
bottom: 0;
right: 0;
}
It works fine with Chrome 3 and Firefox 3.6 but IE8 sucks...
what can be a suitable solution for it?
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 :)
Try this:
#foo
{
position: absolute;
top: 100%;
right: 0%;
}