28172 sujets

CSS et mise en forme, CSS3

Bonjour,Bonsoir

j'ai deux problem avec IE8

voici le code css


body {
	background-color:white;
    background-image:url('IMAGES/back.png');
    background-attachment:fixed;
    background-repeat:repeat-y;
    overflow:hidden;
    margin:0;
    padding:0;

}
#global {
overflow: hidden;
	background: white none;
	border:1px black dotted;
	height:1000px;
	margin:0 auto 0 auto;
	width:1000px;
    padding:0;
}
#header {
      background:white url('IMAGES/header.png') no-repeat ;
      width:1000px;
      height:210px;
      direction:rtl;
      margin:0px;
      padding:10px 0px 0px 0px;
}
#header ul {
	display:table;
	padding:0px 0px 0px 0px;
	margin:0px;

}
#header ul li {
	display:inline-block;
     font-family:"Times New Roman", Times, serif;
     font-size:small;
     color:gray;
   /*  border-left:1px orange dotted ;*/
          border-right:1px orange dotted ;
          padding:0px 12px 0px 12px; 
          margin-left:0px;  }
#header ul li:hover {
	background-color:#5b7e8a;

}
#header ul li a {
	font-family:"Times New Roman", Times, serif;
     font-size:small;
     color:gray;
     vertical-align:middle;

}
#header ul li a:hover {
	color:orange;


}



le code html



<div id="global">
<div id="header">
<ul>
<li><a href="#">Contacter nous</a></li>
<li><a href="#">A propos</a></li>
<li><a href="#">S'inscrire</a></li>
</ul></div>
</div>


le premier c'est avec les images

avec firefox et c'est ce que je cherche

http://h.imagehost.org/0702/p1-fr.png

avec IE8 regarder la flech il reste une marge a gauche

http://h.imagehost.org/0321/p1-ie.png

le dexieme problem c'est que la balise div d'id global se decale un peu vers le gauche avec ie8

voici une image avec firefox et c'est ce que je cherche

http://h.imagehost.org/0760/pr1-fr.png

et avec ie8

http://h.imagehost.org/0627/pr2-ie.png

est ce qu'il ya quelque chose quel faut savoir a props de iE

merci
Modifié par sosdes (11 Jul 2009 - 20:40)
Administrateur
Bonjour,

Un samedi soir pendant un "pont" estival (14 juillet férié en France) non y a pas forcément de suggestions dans les 3H qui suivent Smiley rolleyes 24h ce sera déjà bien et pour ma part ce serait plutôt pas avant le 15 que j'aurai le temps ...

Une suggestion quand même: si le site est en français, mieux vaut utiliser
text-align: right;
que
direction: rtl;

et réserver cette dernière instruction aux langues qui s'écrivent de droite à gauche
Malgrés que j'ai pris l'habitude de cuisiner de manière un peu rustiique mes CSS/
Je te conseillerais de créer une feuille de style corrective spéciale IE ou tu recalerais ainsi tes margin et padding afin d'arriver au résultat rêvé!

De plus à l'initial de ton code tu peux attribuer des margin et padding 0 à tous les éléments utilisés:


html, body, div, span, , ul, li (etc....) {
border:0 none;
font-family:inherit;
font-size:100%;
font-style:inherit;
font-weight:inherit;
margin:0;
outline-style:none;
outline-width:0;
padding:0;
}


Je ne sais pas si cela t'aidera!