28172 sujets

CSS et mise en forme, CSS3

Bonjour à tous,

Je débute en matière de création web et je dois réaliser un site web pour un projet universitaire. Pour l'instant, mon principal objectif est de faire en sorte d'avoir un design étirable s'affichant correctement sur la plupart des navigateurs, et c'est bien la que ca coince. Mon site ne s'affiche jamais de la même manière, même sur deux navigateurs identiques (en l'occurrence Firefox). Chez moi, si je teste le site sous Firefox pas de problème, sous Safari j'ai un décalage de 1px assez gênant au niveau de la partie étirable, et sous IE je n'en parle pas. J'ai pu observer ce décalage de 1 px sur 2 PC tous les deux équipés de Firefox (sur l'un pas de problème et sur l'autre décalage). Il arrive parfois que la partie étirable soit décalée de plus d'un pixel ou apparaisse toute noire.
Mon site est valide du point de vue CSS et XHTML (W3C). J'ai également essayé d'isoler le problème avec le plugin Web Developper mais sans résultat pour le moment.
La question est la suivante: comment modifier mon code pour obtenir quelque chose qui s'affiche à peu près correctement ?

Je vous joins le lien de mon site:
http://perso.univ-lemans.fr/~s090762/COM231A/Site/site.html

Merci d'avance.
Modifié par gigot d'agneau (22 Oct 2010 - 14:57)
Bonjour,

Plusieurs remarques en vrac :

* Sur le web, vouloir afficher un site de la même façon, au pixel près, sur tout navigateur, c'est de l'utopie ; et ça n'a pas forcément d'intérêt.

* De quelle version d'IE parles-tu, il en existe 3 actuellement sur le marché ; chacune a ses problèmes distincts.

* Dans la section Apprendre du site, tu trouvera (sous l'onglet outils) une galerie de template, il peuvent être une bonne base pour commencer (et ils s'affichent bien sur les navigateurs les plus courrant).
Pour le navigateur IE, il s'agit de IE6.
En ce qui concerne les gabarits, c'est vrai que c'est très utile quand on débute. Mon problème c'est qu'avec les images que j'utilise, le texte de mon corps de page doit commencer dans l'entête; le début est donc dans l'entête et le reste dans le corps. Voici n petite image pour résumer un peu tout ca:

upload/33574-gabarit.jpg

Pour l'instant mon gabarit XHTML est le suivant:


<div id="global"> 
	<div id="header">	
	     <div id="menu">
	     </div>	
	     <div id="corps">
	     </div>
	</div>		
	<div id="footer">
	</div>	
</div>	 


L'image se répéte en y sur le bloc global (CSS).
Modifié par gigot d'agneau (22 Oct 2010 - 14:56)