28173 sujets

CSS et mise en forme, CSS3

Problème avec float et redimensionnement de fenêtre

Bonjour,
J'ai des problèmes d'affichage à l'adresse suivante http://www.anglais-net.univ-avignon.fr/saes07/index.html Tout s'affiche correctement en plein écran mais lorsque j'essaie de redimensionner la fenêtre du navigateur l'image centrale et les blocs de droite se décalent en bas. C'est surtout un problème pour Explorer, qui arrivent à afficher de manière différente la même page quand on la recharge!
Voici un bout du code html et le css qui y correspond:


<div id="Sidebar">
<div id="Header">
<a href="http://www.saesfrance.org/"><img style="border: 0px solid ; width: 71px; height: 68px;" src="images/saes.jpg" title="Logo SAES" alt="Logo SAES" id="Logo_SAES" /></a>
<p id="Page_title">Universit&eacute;
d'Avignon et des Pays de Vaucluse 11-13 Mai 2007 <br />
47e Congr&egrave;s de la Soci&eacute;t&eacute; des
Anglicistes de l'Enseignement Sup&eacute;rieur</p>
<a title="Universit&eacute; d'Avignon." href="http://www.univ-avignon.fr/">
<img style="border: 0px solid ; width: 75px; height: 108px;" src="images/Logo_avig.gif" title="Visiter le site de l'UAPV" alt="UAPV Logo" id="Logo_UAPV" /></a></div>
<div id="Centre">
<img title="&copy; Photo: Teatr Novogo Fronta (Tch&eacute;quie):  http://www.tnf.cz/"  style="width: 650px; height: 414px;" id="D&eacute;cor" alt="Photo: l'envers du d&eacute;cor" src="images/decor.jpg" /></div>
<div id="Footer">



 #Sidebar { float: left;
    width: 25%;
    color: white;
    height: 630px;
    z-index: 0;
    background-color: rgb(251, 191, 0);
    }

  #Header { float: left;
    width: 75%;
    color: white;
    height: 170px;
    z-index: 0;
    background-color: rgb(243, 241, 238);
    }

  #Logo_SAES { border: none ;
    position: absolute;
    top: 15px;
    right: 30px;
    width: 71px;
    height: 68px;
    }

  #Page_title { background: transparent none repeat scroll 0% 50%;
    position: relative;
    left: -100px;
    width: 90%;
    font-family: Arial,Helvetica,sans-serif;
    line-height: 1.2em;
    font-weight: bold;
    font-size: 20px;
    text-align: center;
    margin-top: 30px;
    padding-top: 0pt;
    color: rgb(18, 73, 148);
    }

  #Logo_UAPV { border: none ;
    position: absolute;
    top: 15px;
    left: 30px;
    width: 75px;
    height: 108px;
    }

  #Centre { float: left;
    color: inherit;
    z-index: 0;
    background-color: rgb(209, 203, 196);
    position: relative;
    width: 75%;
    height: 400px;
    }

  #Décor { border: 3px solid rgb(209, 203, 196);
    width: 650px;
    height: 414px;
    margin-top: -40px;
    margin-left: -70px;
    margin-bottom: 50px;
    position: absolute;
    z-index: 0;
    }

  #Centre_Text { border: 3px solid rgb(209, 203, 196);
    padding: 10px;
    width: 630px;
    height: 394px;
    margin-top: -50px;
    margin-left: -70px;
    margin-bottom: 50px;
    position: absolute;
    z-index: 0;
    overflow: auto;
    background-repeat: repeat-y;
    font-family: Arial,Helvetica,sans-serif;
    color: rgb(0, 0, 102);
    background-color: rgb(243, 241, 238);
    font-weight: normal;
    text-align: justify;
    font-size: 10pt;
    }

  #Footer { height: 60px;
    color: inherit;
    float: left;
    width: 75%;
    background-color: rgb(209, 203, 196);
    }


Merci beaucoup d'avance pour votre aide!
Modifié par sigma (01 Jul 2006 - 14:06)
Bonjour sigma,

Pourrais-tu éditer ton premier message afin de baliser ton code correctement, conformément à la Règle 13 du forum ?
Tu peux utiliser le bouton d'édition en haut à droite de ton premier message, et rajouter autour de ton code les balises [ code] et [ /code] (sans les espaces).
Merci d'avance.
Sujet clos
Aller à