Houden jullie van mysteries? Nou hier komt er eentje.
Ik heb een sticky footer op mijn pagina's geplaatst met de volgende code:
Dit werkt eigenlijk perfect. Perfect? Nee, want hier komt het mysterie. Het werkt op alle pagina's van mijn website perfect, behalve op één enkele pagina. Met exact dezelfde opmaak wordt hij in IE9 weergegeven als dubbel zo lang, waarbij de footer in het midden blijft zweven. Dus die pagina voegt een dubbele lengte (met enkel achtergrondkleur) toe. Andere pagina's doen dit niet. Ook op mijn laptop (ook IE9) geeft het geen probleem.
Nu is het vreemde dat als ik die mysterieuze pagina op mijn computer 'herlaad' (refresh), dan wordt hij ineens wél goed weergegeven. Het verwijderen van de internetgeschiedenis lijkt er verder geen effect op te hebben. Wanneer ik eenmaal de pagina herladen heb, dan blijft hij het goed doen. Echter als ik de volgende dag weer check, dan is het probleem er weer (misschien met herstart van de computer?)
Ik snap er niks van. Wie heeft al eens met dit mysterieuze probleem geworsteld, klinkt het bekend in de oren, of doorziet in een oogopslag waar het probleem zit?
Ik heb een sticky footer op mijn pagina's geplaatst met de volgende code:
HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
html {
height: 100%;
}
body {
background-color: #FFF;
font-size: 12px;
text-align: center;
position: relative;
font-family: Arial, Helvetica, sans-serif;
color: #000;
width: 960px;
height: 100%;
margin-left: auto;
margin-right: auto;
margin-top: 0;
margin-bottom: 0;
overflow-y: scroll;
}
#wrap-copyright {
min-height: 100%;
height: auto !important;
height: 100%;
margin-bottom: 0 px;
}
#copyright {
position: relative;
left: 0px;
width: 140px;
margin-top: -30px;
clear: all;
text-align: right;
float: left;
}
</style>
</head>
<body>
<div id="wrap-copyright">
Mijn verhaal, geordend met verschillende div's en opmaak die niet relevant is hier op te nemen.
</div>
<div id="copyright">© 2011-2012 Aloneal
</div>
</body>
</html>Dit werkt eigenlijk perfect. Perfect? Nee, want hier komt het mysterie. Het werkt op alle pagina's van mijn website perfect, behalve op één enkele pagina. Met exact dezelfde opmaak wordt hij in IE9 weergegeven als dubbel zo lang, waarbij de footer in het midden blijft zweven. Dus die pagina voegt een dubbele lengte (met enkel achtergrondkleur) toe. Andere pagina's doen dit niet. Ook op mijn laptop (ook IE9) geeft het geen probleem.
Nu is het vreemde dat als ik die mysterieuze pagina op mijn computer 'herlaad' (refresh), dan wordt hij ineens wél goed weergegeven. Het verwijderen van de internetgeschiedenis lijkt er verder geen effect op te hebben. Wanneer ik eenmaal de pagina herladen heb, dan blijft hij het goed doen. Echter als ik de volgende dag weer check, dan is het probleem er weer (misschien met herstart van de computer?)
Ik snap er niks van. Wie heeft al eens met dit mysterieuze probleem geworsteld, klinkt het bekend in de oren, of doorziet in een oogopslag waar het probleem zit?
