28173 sujets

CSS et mise en forme, CSS3

IE<-->firefox

Bonjour,

Je me lance à batir un site XHTML et CSS, conforme. Mais j'ai des galères !!! Je batis juste mes blocs et j'ai dejà des différences entre IE et Firefox... comment savoir quoi utiliser qui soit comptatible, et conforme ???

Merci d'avance pour vos conseils !


essais en cours:

Html 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
   <head>
       <title>Bienvenue sur mon site !</title>
       <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
	   <link rel="stylesheet" media="screen" type="text/css" title="design" href="design.css" />
   </head>
   <body>
       <!-- ****************                     TITRE			 ********************************************-->
	   <div id="header"><h1>TITRE DE LA PAGE</h1></div>
	        
	   
	   
	   
<!-- ****************                     Corps droit		 ********************************************-->
	   
	   <div id="corps_d"><h2>Contenu droit</h2>
	   Contenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droitContenu droit
	   </div>
	   
<!-- ****************                     Contenu Gauche		 ********************************************-->
	   <div id="corps_g"><h2>Contenu gauche</h2><br/>
	   Contenu gauche Contenu gauche Contenu gauche Contenu gauche Contenu gauche Contenu gauche Contenu gauche Contenu gauche Contenu gauche Contenu gauche Contenu gauche Contenu gauche Contenu gauche Contenu gauche Contenu gauche Contenu gauche Contenu gauche Contenu gauche Contenu gauche Contenu gauche Contenu gauche Contenu gauche Contenu gauche Contenu gauche Contenu gauche Contenu gauche Contenu gauche Contenu gauche Contenu gauche Contenu gauche Contenu 
	   </div>
	   
		<!-- ****************                     Contenu Menu			 ********************************************-->
	   <div id="bottom_menu"><h2>Contenu menu</h2><br/>
	   Contenu menuContenu menuContenu menuContenu menuContenu menuContenu menuContenu menuContenu menuContenu menuContenu menuContenu menuContenu menuContenu menuContenu menuContenu menuContenu menuContenu menuContenu menuContenu menuContenu menuContenu menuContenu menuContenu menuContenu menuContenu menuContenu menuContenu menuContenu menuContenu 
	   </div>
	     
	   
	   <!-- ****************                    Copyright			 ********************************************-->
	   <div id="bottom_copyright"><h2>Bottom_copyright !</h2>
	   
	   </div>
   </body>
</html>


css
body
{
   width: 1024px;
   margin: auto;
   margin-top: 20px;
   margin-bottom: 20px;
   background-color: #003333;
}

/*		 F O RM A T AG E   D E S    B L O C S    C O N T E N U S 	  */
#header
{
width:492px;
height: 100px;
margin-bottom:10px;
float:left;
border: 1px solid black;
padding:5px;

}


#corps_d
{

width:492px;
margin-bottom: 10px;
float: right;
border: 1px solid black;
padding:5px;
}


#corps_g
{
width:492px; 
margin-bottom: 10px;
 border: 1px solid black;
float:left;
padding:5px;
}



#bottom_menu
{
width:492px;
margin-bottom: 10px;
float: right;
border: 1px solid black;
padding:5px;
}

#bottom_copyright
{
margin-bottom: 10px;
padding:5px;
  }



/*		 F O RM A T AG E   D U   T E X T E 	  */
h1{
background-image: url(puce.jpg);
background-repeat:no-repeat;
text-indent:45px;
margin-left: 45px;
padding-bottom:15px;
font-family: Lucida, Trebuchet MS, Helvetica,Arial,  sans-serif ;
font-size:1em;
font-style: small-caps;
/*font-weight:bold;*/
letter-spacing:1;
word-spacing: 0.1em;
}
effectivement, je n'avais pas lu, car je croyais savoir. Je viens de tester, et il marche , mais tu as du le modifier... Smiley cligne

Non, je ne le considère pas comme résolu, puisqu'il me reste un problème de décalage malgré ma correction de DTD... Je suis en pleine recherche, et mettrai Smiley resolu dès qu'il sera Smiley resolu , avec, en prime, une solution ... !

merci !
Sujet clos
Aller à