Cette page est un exemple de la technique de mise en page exposée dans Initiation au Positionnement CSS : 3.position absolue et fixe.
Dans les navigateurs conformes au standard CSS2, le menu de la colonne de droite reste fixé à la même position lorsque le reste de la page défile. Dans les navigateurs qui ne reconnaissent pas le positionnement fixe (Internet Explorer 5.x Windows), ce menu est en position absolue : il est donc alors soumis au défilement.
Le code correspondant est :
En CSS :
.page { width: 70%; border: 1px solid #000000; padding: 1em 1%; } .menu { position: absolute; top: 2em; right: 1em; background-color: #ffecce; border: 1px solid #666666; padding: 1em; width: 20%; } html>body .menu { position: fixed; }
En HTML :
<body> <div class="page"> ... </div> <div class="menu"> <ul> <li>lien_1</li> <li>lien_2</li> <li>lien_3</li> </ul> </div> </body>
Accueil OpenWeb | Plan du site | Conditions de réutilisation
Cette page est valide Xhtml et Css
Ce site s'affiche mieux dans un navigateur conforme aux standards, voici pourquoi