Based on my CSS, all Browsers including IE7 show my bottom bar correct and fixed, all the time.
.bottom-fixed {
position: fixed;
bottom: 0;
margin-left: -235px;
min-width: 1160px;
max-width: 130em;
width: 100%;
}
However there is something strange in IE8. If you resize the browser window height with help of your right corner at the bottom (the way you can change a windows width and height at开发者_JAVA技巧 the same time), all is fine.
But if you resize the window height grapping the top or bottom of your browser window, the bar/div stuck at the position like it would when position was absolute instead of position: fixed.
Any idea how to fix that?
(Using Doctype for HTML5)
I couldn't fix that with the parent float solution from this thread Umer mentioned.
So I fixed it with a simple Javascript script which applies position: fixed all the time when the window gets resized.
HTML
<!--[if IE 8 ]>
<script type="text/javascript">
$(window).resize(function () {
ApplyPositionFixed();
});
</script>
<![endif]-->
Javascript
function ApplyPositionFixed() {
// Check if element exists
if ($("#bottom-bar-content").length) {
$(".bottom-fixed").attr('style', 'position: fixed;');
console.log("Window resized");
}
else {
console.info("No element changes on Window resize");
}
}
However. I'm ready for better solutions.
There is another solution: setting height explicitly on the parent element. For example height: 1% or height: 100%.
Had the same issue, but the fix in my case was that the parent had position: relative. Once I removed that, this issue went away.
for fixed position in IE 8 - , DOCTYPE is very very important.
one of:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
or
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
or
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
or
<!DOCTYPE HTML>
And its very very important that those be in first line.
![Interactive visualization of a graph in python [closed]](https://www.devze.com/res/2023/04-10/09/92d32fe8c0d22fb96bd6f6e8b7d1f457.gif)
加载中,请稍侯......
精彩评论