Bonjour à tous,
Au vu de la réaction d'Ymai, j'ai remis le couvert et retrempé mes doigts dans la soupe (pour le vin, moi je marche au Beaujolais) !
J'ai donc réussi à faire un peu de ménage (j'ai fait la découverte de Notepad++ qui m'a permis au moins d'avoir une visualisation plus confortable que celle de mon bloc-notes ; en attendant d'en connaître plus sur NotePad++ ?) : la méthode de la découverte !
J'ai mis en css d'autres choses, en particulier le style intégré dans mon <body style....>. J'ai aussi réagencé l'ordre du code pour avoir successivement le texte "utile", le menu1 (fixe gauche) et le menu2 (fixe haut). Je suis ensuite passé par le W3C validation service pour le code et la css.
A partir de là, j'ai essayé à nouveau la solution "du div global" de Kristof. J'ai tout d'abord mis le #global dans la css, calé à 824px pour être certain de voir s'il y avait un effet.
J'ai inséré le <div id="global> en tête de body.
- Si je mets le</div> en fin de body : pas d'effet visible sous IE sur la barre de défilement et mes menus 1 et 2 ne sont plus fixes en défilement vertical.
- Si je mets le </div> avant les "appels" aux menus : les menus sont fixes, mais il n'y a toujours pas d'effet visible sur la barre de défilement horizontale.
Je ne sais pas quoi tenter d'autre.
Si le coeur vous en dit :
Ma feuille de style (avec le #global intégré)
/* Generated by KaZcadeS */
#global
{
width:824px;
margin:0 auto;
}
body {
margin: 200px;
padding: 0;
color: #ffff00;
font-weight: bold;
text-decoration: none;
background-color: #0070c0;
cursor:url("icones/insigne.cur");
margin-top: 60px;
height: 100%;
margin-left: 200px;
width: 824px;
}
html > body {
color: #ffff00;
font-weight: bold;
background-color: #0070c0;
text-decoration: none;
}
.content {
border-width: 20px;
height: 100%;
overflow: auto;
color: #ffff00;
font-weight: bold;
background-color: #0070c0;
margin-right: 0px;
text-decoration: none;
}
.menu1 {
border-top: 0px solid #00aff0;
position: absolute;
top: 0;
left: 0;
color: #00aff0;
font-weight: bold;
height: 768px;
width: 170px;
text-decoration: none;
font-weight: bold;
background-color: #002060;
}
body > .menu1 {
position: fixed;
color: #00aff0;
font-weight: bold;
background-color: #002060;
text-decoration: none;
}
.menu2 {
border: 0px solid #00aff0;
position: absolute;
top: 0;
left: 0;
height: 40px;
color: #00aff0;
font-weight: bold;
background-color: #002060;
text-decoration: none;
width: 1024px;
visibility: visible;
margin-left: 170px;
}
body > .menu2 {
position: fixed;
color: #00aff0;
font-weight: bold;
background-color: #002060;
text-decoration: none;
}
.boite {
border: 2px solid black;
width: 20%;
height: 100%;
color: #ffff00;
font-weight: bold;
background-color: #0070c0;
text-decoration: none;
}
a {
border: 2px solid #002060;
font-weight: bold;
background-color: #002060;
color: #00aff0;
text-decoration: none;
}
a:hover {
border: 2px solid #00aff0;
font-weight: bolder;
color: #002060;
background-color: #00aff0;
text-decoration: none;
}
Mon code (les <div id="global> et </div> ne sont pas insérées)
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "
http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<link rel="shortcut icon"
href="
http://perso.orange.fr/promotion.koenig ... avicon.ico">
<meta content="text/html; charset=ISO-8859-15"
http-equiv="content-type"><title>Promotion Général KOENIG_page</title><meta
name="description"
content="Site de la promotion général koenig 1970 1971 de l'école militaire interarmes"><meta
name="keywords"
content="promotion, école miltaire interarmes, général koenig, association promotion général koenig, emia"><meta
name="robots" content="index,follow"><meta
content="G. DELLE LUCHE webmestre du site de la promotion Général KOENIG"
name="author"><meta http-equiv="Content-Type"
content="text/html; charset=iso-8859-1"><link rel="stylesheet"
type="text/css" href="style_page.css">
<meta content="Page de démarrage" name="description">
</head>
<body>
<div style="text-align: center;"><b style="font-family: Century Gothic;">Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa Aaaaaaaa
</b>
</div>
<br>
<div style="text-align: center;" class="menu1"><b
style="font-family: Georgia;"><br><a href="tradi_koenig.html">Promotion<br>Général
KŒNIG</a>
<small><small><br><br><a href="tradi_emia.html">École
Militaire Interarmes<br>1970
- 1971</a><br><br></small></small></b>
<small><a href="tradi_insigne.html"><img
src="images/insigne_koenig_bandeau.jpg"
title="Insigne de la promotion Général KOENIG"
alt="images/insigne_bandeau.jpg"
style="border: 0px solid ; width: 80px; height: 206px;" vspace="2"></a></small><dl
style="text-align: left;"><dd
style="font-family: Century Gothic; margin-left: 20px; width: 150px;"><small><font
size="-1"><a href="accueil.html">Accueil</a><br>
<a href="tradi.html">Les traditions</a><br>
<a href="assoc.html">L'association</a><br>
<a href="promo.html">La promotion</a><br>
<a href="albums.html">Les albums photos</a><br>
<a href="reserve.html">Réservé membres</a><br>
<a href="liens.html">Liens recommandés</a><br><br>
<a href="contacts.html">Les contacts</a><br>
<a
href="javascript:window.external.AddFavorite('
http://perso.orange.fr/promotion.koenig')">Ajouter
aux favoris</a>
</font></small></dd></dl><small><b style="font-family: Century Gothic;">
</b></small></div>
<div
style="text-align: right; margin-left: 170px; width: 884px; color: rgb(255, 255, 0);"
class="menu2"><a href="javascript:history.back();"><img
title="Retour à la page précédemment affichée"
style="border: 0px solid ; width: 80px; height: 36px;"
alt="images/bouton_precedent.gif" src="images/bouton_precedent.gif"
align="middle" vspace="2"></a>
</div>
<script type="text/javascript">
<!--
function mesure(_MesurePro, _page)
{ scr_w = screen.width;
scr_h = screen.height;
color = screen.colorDepth;
ref = escape(window.document.referrer);
document.write('<img src="
http://www.direct-stats.com/logs/webmes ... ge='+_page+ '&n='+ Math.round (Math.random () * 1000000000000000)+ '&reso_w='+ scr_w+ '&reso_h='+ scr_h+ '&color='+ color+ '&referer='+ ref+'" style="border:0px;" />');
}
mesure("Mesure Pro", "page.html");
-->
</script>
</body></html>
Je vous promets de boire un coup à votre santé, pour vous remercier d'une solution, sinon pour votre attention.[/u][/i][/b]
Message envoyé avec : Mozilla/4.0 (compatible; MSIE 7.0; Windows NT 5.1; i-NavFourF; .NET CLR 1.1.4322; .NET CLR 2.0.50727; .NET CLR 3.0.04506.30)