IE fait des siennes sur 3 colonnes

[Julien PHAM]

Bonsoir,

J'ai un gros soucis de positionnement sous IE. Ca marche bien avec firefox, opéra, safari, mais IE ne veut rien savoir.

La manière la plus simple de tester ce dont je parle, c'est d'aller sur mon site avec IE:

http://min.lledrith.info. En 1024 ou 1280, au choix.

Vous obtenez un truc comme ça :

Puis vous demandez l'affichage de la barre latérale, genre favoris ou historique, et ça vous donne ça :

Remarquez que IE me compte la marge de droite (margin-right) comme partant du bord de la fenêtre d'affichage du navigateur, au lieu du bord de la page.

Ma page ayant des éléments graphiques (notamment les titres en flash) quand on réduit la fenêtre ça créé des barres de défilement, c'est normal. Ce qui l'est moins c'est le comportement étrange de IE. Testez mon site avec firefox et réduisez la fenêtre du navigateur, rien ne bouge, il me met juste les barres de défilement correspondantes...

Mon code:

<div id="wrapper1">

    <div id="content">
      <?php print $breadcrumb ?>
	    <?php print $tabs ?>
      <?php print $help ?>
      <?php print $messages ?>
      <?php print $content; ?>
    </div>
  <div id="left-sidebar">
    <?php print $sidebar_left ?>
  </div>
    <div id="right-sidebar">
	    <?php print $sidebar_right ?>
			<div style="text-align:center">
		  	<img src="<?php print $base_path; print $directory ?>/images/affiche_min.jpg" alt="" />
			</div>
    </div>

	<div id="header">
    <div class="logo">
      <object
	      codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0"
        type="application/x-shockwave-flash"
        data="http://www.min-de-nice.fr/files/swf/logomin.swf"
        width="117"
        height="65">
      <param
        name="movie"
        value="http://www.min-de-nice.fr/files/swf/logomin.swf" />
      </object>
      <h1 class='site-name'><a href="<?php print $base_path ?>" title="Home"><?php print $site_name ?></a></h1>    
    </div>
    <div class="banner">
      <object
        type="application/x-shockwave-flash"
        data="/files/swf/min-fete.swf"
        width="750"
        height="125">
      <param
        name="movie"
        value="/files/swf/min-fete.swf" />
      </object>
    </div>    
	</div>

	<div id="footer">
		<div id="copyright">
			Copyright © <?php print $site_name ?><br /><br />
		</div>
 	  <a href="http://validator.w3.org/check?uri=referer"><img
 	    src="/files/img/logos/valid-xhtml10"
   	  alt="Valid XHTML 1.0 strict" height="31" width="88" /></a>
 		<a href="http://jigsaw.w3.org/css-validator/check?uri=referer"><img
      src="/files/img/logos/vcss" 
      alt="Valid CSS!" width="88" height="31" /></a>
    <a href="http://drupal.org"><img
      src="/files/img/logos/powered-by-drupal.png"
 	    alt="Drupal" /></a>
	</div>


</div>

Mon CC:

/* . is a class (maybe several on a page) */
/* # is an id (only one on a page) */

#wrapper1 {
  position:absolute;
  top:0;
	min-width:980px;
	width:100%;
}
#left-sidebar {
  position: absolute;
  left:0;
  top:130px;
  width:200px;
}
#right-sidebar {
  position: absolute;
  right:5px;
  _right:-5px;
  top:130px;
  width:200px;
}
#content {
  border: 2px solid #7B7D1A;
  margin-top:148px;
  background-color:#C5D97C;
	padding-left:10px;
	padding-right:15px;
	padding-top:10px;
	padding-bottom:10px;
	text-align:justify;
  margin-left: 210px;
  margin-right:215px;
	_margin-right:206px;
}
/*html>body #content {
  margin-left: 210px;
  margin-right:215px;
}*/
#footer {
	text-align:center;
	padding-top:10px;
}
#header {
	position:absolute;
	top:0;
	left:0;
	height:130px;
  margin:0 0 0em 0;
	width:100%;
}
#header .logo {
	width:150px;
	text-align:center;
}
#header .banner {
  position:absolute;
  right:0;
  top:0;
}

Merci

[Julien PHAM]

Tiens marrant, le bug dont je parle on le retrouve pas sur IE7 béta, il y en a un autre mais c'est pas le même...

J'en ai maaaarre des bugs IE

[jeanpierre949]

Salut.

Pas teste mais essaie de mettre logo en float:left et

banner margin-left:largeur du logo;

[Julien PHAM]

Ah oui mais moi je veux aligner la bannière à droite, pas à gauche.

Et puis ça c'est secondaire, ce qui me gène c'est ce qu'on voit sur les screens, le texte qui a sa marge qui reste fixe par rapport à la fenêtre du navigateur quand je réduit la fenêtre du browser...