probleme ie/ff/opera

voila, mon design, je l'ai codé en xhtml/css valide, mais le design s'affiche bien sous firefox en 1280*1024, mais en resolution 1024*768, il est mal affiché sous ie.
La partie extensible est décalé vert la droite dans les 3 nav

voila le html:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title>je perfectionne mon coding</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="shortcut icon" href="favicon.gif" type="image/ico" />
<link rel="stylesheet" type="text/css" href="sisyphe.css" title="default" media="screen" />

</head>
<body>

<div id="head"></div>
<div id="texte">
<p id="textemenu">

<a href="#"> Menu</a>
<a href="#"> Menu</a>
<a href="#"> Menu</a>
<a href="#"> Menu</a>
<a href="#"> Menu</a>
<a href="#"> Menu</a>
<a href="#"> Menu</a>
<a href="#"> Menu</a>
<a href="#"> Menu</a>
<a href="#"> Menu</a>
<a href="#"> Menu</a>

   </p>
   <p id="textecorp">Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.

Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi.</p>

</div>
<div id="bascorp"></div>
<p id="footer">Design codé par hellboy pour un membre appartenant à la communauté de <a href="http://www.xtrem-graph.virtuaboard.com">Xtrem-Graph</a> </p>
<div id="pubhaut"></div>
   <div id="pubcentre"><p>mon module de pub</p></div>
   <div id="pubas"></div>

et le css:

*{margin:0;padding:0;}

body
{
margin: auto;
background: #fcdcfc;
font-size: 0.6em;
background-repeat: repeat;
}

#head
{
width: 750px;
height: 138px;
background: url(images/sit6nm_01.jpg) no-repeat;
margin: auto;
}

#texte
{
width: 750px;
margin: auto;
background: url(images/textcentre_02.jpg) repeat-y;
margin-left: 265px;
}

#textemenu
{
font-size: 140%;
width: 80px;
text-align: left;
margin-left: 11px;
}

#textecorp
{
position: relative;
margin-top: -210px;
font-size: 140%;
margin-left: 165px;
width: 70%;
text-align: justify;
}

#bascorp
{
height: 12px;
width: 750px;
margin: auto;
background: url(images/sit6nm_05.jpg);
}

#footer
{
width: 576px;
height: 49px;
background: url(images/sit6nm_08.jpg);
margin-top: 20px;
margin-left: 405px;
text-align: center;
font-size: 130%;
}

#pubhaut
{
width: 128px;
height: 10px;
margin-left: 263px;
margin-top: -46px;
background: url(images/sit6nm_03.jpg);
}

#pubcentre
{
width: 126px;
background: url(images/sit6nm_15.jpg) repeat-y;
margin-left: 265px;
}

#pubas
{
width: 126px;
height: 15px;
background: url(images/sit6nm_17.jpg);
margin-left: 265px;
}

#pubcentre p,a,img
{
margin-left: 5px;
}

#textemenu a
{
text-decoration: none;
color: yellow;
margin-left: 30px;
font-style: italic;
font-size: 120%;
}

#textemenu a:hover
{
text-decoration: underline;
color: blue;
}

Si vous pouviez m'aider à résoudre le probleme, ce serait cool de votre part, merci

hellboy

12 juillet 2006 à 13:37:01

kabuto_fr

12 juillet 2006 à 14:28:56

Salut,

dans ton css "text" retire le margin-left.

#texte
{
width: 750px;
margin: auto;
background: url(images/textcentre_02.jpg) repeat-y;
/*margin-left: 265px;*/
}

Je te laisse chercher pour le reste.

ps :

body
{
margin: auto;
background: #fcdcfc;
font-size: 0.6em;
/*background-repeat: repeat;*/ inutile
}

12 juillet 2006 à 14:48:12

ok, j'essaye
lol, je vois ce qui cloche dans le body

j'ai un autre bug, quand je passe en 1024*768 ou quand j'enleve la page en mode plein écran, le footer et le block vert ce decale à doite, pouvez vous m'aider à resoudre le proble ?

probleme d'incompatibilite ou d'imbrication.

probleme ie/ff/opera

Supprimer

Modérer

Signaler le message aux modérateurs