Pb affichage Firefow et Safari - HTML/CSS - Programmation
Marsh Posté le 31-01-2012 à 11:57:58
hello, commence déjà par agrandir la largeur de ta div "menu". l'onglet contact va s'aligner avec les autres.
Marsh Posté le 31-01-2012 à 12:00:23
et sur le span "bgi" réduis le padding-top à 4px;  
 
(comme ça, ça marche sur firefox mais je n'ai pas IE pour tester)
Marsh Posté le 31-01-2012 à 13:59:11
| _Pinkette_ a écrit : et sur le span "bgi" réduis le padding-top à 4px;   | 
 
 
Merci beaucoup Pinkette de te pencher sur mon pb, je teste cela et te tient au courant .
Marsh Posté le 31-01-2012 à 14:08:39
Je viens de tester cela reste identique , j avais deja tester le probleme d'agrandissement, mais c est idem , je seche grave , je comprends pas , voici ce que cela donne sur mon css : 
 
/* menu */  
.menu { 
 padding:0; 
 width:550px; 
 float: right; 
 margin-top: 30px; 
 margin-right: 0; 
 margin-bottom: 0; 
 margin-left: 0; 
} 
.menu ul { padding:3px 0; margin:0; list-style:none; border:0;} 
.menu ul li { float:left; margin:0; padding:0 3px; border:0;} 
.menu ul li a { 
 display:block; 
 float:left; 
 color:#fff; 
 font:normal 14px  Arial, Helvetica, sans-serif; 
 text-decoration:none; 
 margin-top: 0; 
 margin-right: 1px; 
 margin-bottom: 0; 
 margin-left: 0; 
 padding-top: 12px; 
 padding-right: 0; 
 padding-bottom: 12px; 
 padding-left: 0; 
} 
.menu ul li a span.bgi { padding:17px 15px 31px 15px !important; padding:24px 15px; background:none;} 
.menu ul li a:hover { 
 color:#ff994e; 
 background-repeat: no-repeat; 
 background-position: right; 
 background-image: url(images/r_menu.gif); 
 padding-top: 4px; 
} 
.menu ul li a:hover span.bgi {color:#ff994e;  background:url(images/l_menu.gif) no-repeat left;} 
.menu ul li a.active {color:#ff994e; background:url(images/r_menu.gif) no-repeat right ;} 
.menu ul li a.active span.bgi {color:#ff994e; background:url(images/l_menu.gif) no-repeat left;} 
.menu ul li a span.bgi span { color:#CCC; font:normal 11px Arial, Helvetica, sans-serif; display:block; text-align:center;} 
 
 
Merci de ton aide tres apprecié 
Marsh Posté le 31-01-2012 à 10:44:05
Bonjour ,
je finaissais un site web , et lorsque surprise je le met en ligne , sur IE9 , ca fonctionne super , par contre sur safari et firefox 9 , decalage du menu , le "contact" se met en dessous et les slides des pages secondaires sont decalés aussi , j ai tout essayé les mises a jours JS , c est encore pire . sur firefox 6 cela etait super. Là j ai la tete a lenvers , a trop chercher des fois on en perd son latin , le site www.cash94.fr ,
Voici mon deut de code pour mon Style.css
@charset "utf-8";
body { margin:0; padding:0; width:100%; background:#fff;}
html { padding:0; margin:0;}
/* main */
.main {width:100%; padding:0; margin:0 auto; }
.resize { width:955px; margin:0 auto;}
/********** header **********/
.header {
height:176px;
background:url(images/header_bg.gif) top repeat-x;
}
.block_header {
width:995px;
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
margin-left: auto;
}
.top_menu { float:right; padding:4px 10px; font:normal 11px Tahoma, Geneva, sans-serif; color:#4e4e4e; line-height:1.6em;}
.top_menu a { font:normal 11px Tahoma, Geneva, sans-serif; color:#4e4e4e; text-decoration:none;}
.top_menu a:hover {text-decoration:underline;}
/*******Twitter**********/
.RSS { width:180px; height:24px; float:right; padding:10px 0 0 30px; margin:0; background: url(images/RSS.gif) left no-repeat; font:normal 11px Arial, Helvetica, sans-serif; color:#575757;}
/* logo */
.logo { float:left; padding:0; margin:0; width:422px;}
/* menu */
.menu {
padding:0;
width:510px;
float: right;
margin-top: 30px;
margin-right: 0;
margin-bottom: 0;
margin-left: 0;
}
.menu ul { padding:3px 0; margin:0; list-style:none; border:0;}
.menu ul li { float:left; margin:0; padding:0 3px; border:0;}
.menu ul li a {
display:block;
float:left;
color:#fff;
font:normal 14px Arial, Helvetica, sans-serif;
text-decoration:none;
margin-top: 0;
margin-right: 1px;
margin-bottom: 0;
margin-left: 0;
padding-top: 12px;
padding-right: 0;
padding-bottom: 12px;
padding-left: 0;
}
.menu ul li a span.bgi { padding:17px 15px 31px 15px !important; padding:24px 15px; background:none;}
.menu ul li a:hover {
color:#ff994e;
background-repeat: no-repeat;
background-position: right;
background-image: url(images/r_menu.gif);
}
.menu ul li a:hover span.bgi {color:#ff994e; background:url(images/l_menu.gif) no-repeat left;}
.menu ul li a.active {color:#ff994e; background:url(images/r_menu.gif) no-repeat right ;}
.menu ul li a.active span.bgi {color:#ff994e; background:url(images/l_menu.gif) no-repeat left;}
.menu ul li a span.bgi span { color:#CCC; font:normal 11px Arial, Helvetica, sans-serif; display:block; text-align:center;}
En esperant que vou spuissiez m'aider .
Merci d'avance
---------------
Merci a ceux qui m'aide , et j espere avoir aidé les autes