Considérons le code suivant :
div {
width:100%;
height:64px;
border:1px solid #000;
}
.top-fixed {
position:fixed;
}
.middle-fixed {
position:fixed;
top:64px;
}
.bottom {
margin-top:128px; #64+64
}
<html>
<head></head>
<body>
<div class="top-fixed">Top Fixed</div>
<div class="middle-fixed">Middle Fixed</div>
<div class="bottom">Bottom</div>
</body>
</html>Pour div.bottom, j'utilise la propriété margin-top afin qu'elle ne chevauche pas la div la plus haute. Mais cela fait également descendre div.top-fixed avec lui-même (voir le test).
Comment puis-je y remédier ? L'une des solutions consiste à utiliser la propriété padding-top pour div.bottom au lieu de margin-top, mais cela ne semble pas très élégant.
