28173 sujets

CSS et mise en forme, CSS3

Bonjour le forum,

je viens de faire quelques modifs sur le design de mon site, et j'ai actuellement 2 problèmes que je n'arrive pas à résoudre.

page test: -http://www.loterie-loto-keno.com/test.php

Le premier: sous IE6
cela se passe juste en dessous du menu

<div class="fdbodytop"></div>


et le code CSS:


.fdbodytop {
background-image : url(px/design/fd-bodytop.gif);
height : 5px;
width : 100%;
}


Je n'arrive pas à appliquer une hauteur de 5px .... !? (fonctionne sous les autres navigateurs)

2eme problème, ce coup si sous FireFox 1.5
Cela se passe dans le menu de gauche:
il y a un espace indésirable dans le menu de gauche en footer, (uniquement sur le second qui ne contient pas de puce).

<div class="menu_left_footer"></div>


Code CSS

.menu_left_footer {
width : 262px;
height : 8px;
background-color : #fdefff;
background-image : url("px/fd_menu_left_footerA.png");
background-repeat : no-repeat;
padding : 0;
margin : 0;
margin-bottom : 10px;
}


Merci de votre coup de pouce Smiley cligne
Bonne journée
Modifié par aieaieaie (21 Jan 2008 - 13:00)
bonjour

ici :

<div class="menu_left_body">
   [#red]<p>[/#]njniinjinji</p>
   <p>,njnjinji</p>
   <p>njinijnjni[#red]</p>[/#]
  </div>


j'ai mis en rouge les balises manquantes, je ne sais pas si ça résoudra le problème, peut-être...
Modérateur
bonsoir,

pour firefox:

p {margin:0}


Une histoire de marge par defaut , En generale on rencontre sur les element p et hn d'une page dans ce navigateur , une marge avant et aprés d'1em , marge corespondant au saut de ligne provoqué par le comportement block de ces balises. Dans IE ces marges sont absorbées et n'apparaissent pas .

Une mise a zero est résout la difference.

Pour IE


.fdbodytop {
background-image : url(px/design/fd-bodytop.gif);
height : 5px;
/* au choix: */
overflow:hidden;
/* ou */
font-size:5px;
width : 100%;
}


Dans IE , les elements de type block recoivent par defaut une hauteur d'1em minimale.

Dans ton exemple , la hauteur fixer a 5 px est inferieur a 1em (taille de police environ a 12px /small).

au choix donc : fixer la taille de police ou cacher ce qui depasse.

Une autre solution consisterais a mettre en repetition horizontal ton fon:


.fdbodytop {
background: url(px/design/fd-bodytop.gif) repeat-x ;
height : 5px;

width : 100%;
}


GC
@ verdan
Merci pour le coup de pouce, mais non cela ne vient pas de la Smiley cligne

@Gcyrillus,
Super ton coup de main, des explications claires et compréhensibles, et de plus des solutions efficaces!

Bravo pour la qualité des réponses sur ce forum!
A très bientôt!