Pb de CSS avec FF

Pb de CSS avec FF - HTML/CSS - Programmation

Marsh Posté le 20-02-2006 à 21:49:32    

Bonjour,
 
Je créer actuellement un site (http://tt.ufolep91.free.fr) qui a la structure suivante :

Code :
  1. <html>
  2. <body>
  3. <div class="wapper">
  4. plein de contenu avec div, ect...
  5. </div>
  6. </body>
  7. </html>


 
Et le tt lié a un css contenant cela :
 

Code :
  1. body
  2. {
  3. margin-left:auto;
  4. margin-right:auto;
  5. text-align:center;
  6. background-color:#E6E6FA;
  7. }
  8. .wapper
  9. {
  10. background-color:#FFF0F5;
  11. width:982px;
  12. margin-left:auto;
  13. margin-right:auto;
  14. background-image:url(../images/table raquettes.gif);
  15. background-repeat:no-repeat;
  16. background-position:290px 200px;
  17. border: #cccccc 1px solid;
  18. text-align:left;
  19. }


Le tout fonctionne parfaitement sous IE, mais pas sous FF, la partie wapper n'est pas entiérement prise en compte :
- le background-image ne fonctionne pas,
- le background-color ne fonctionne pas,
- le border ne fonctionne pas !
 
Je comprend pas!
 
Pourtant j'ai des choses du meme genre ds la suite de mon CSS pour d'autre classe, et ca fonctionne trés bien :|
 
Une idée SVP???


Message édité par energiez le 20-02-2006 à 21:51:07
Reply

Marsh Posté le 20-02-2006 à 21:49:32   

Reply

Marsh Posté le 20-02-2006 à 22:11:57    

met des guillemets dans url
background-image:url("../images/table raquettes.gif" );
 
et puis un conseil
ne mets jamais d'espace dans le nom de tes fichiers
et puis tu peux aussi faire ca si ca te chante :  
background-image:url(../images/table%20raquettes.gif);

Reply

Marsh Posté le 20-02-2006 à 22:21:09    

Hello,
 
Parce qu'aucun de tes blocs à l'intérieur de ton bloc principal wapper ne sont dans le flux, du coup celui-ci n'a aucune hauteur.
Si tu veux que ton waper descende jusqu'en bas, il te faut ajouter un clear:both (pour interrompre le flottement) dans ton css du pied de page et lui enlever son float:
 

Code :
  1. .pied
  2. {
  3. width:980px;
  4. height:80px;
  5. background-color:#4682B4;
  6. clear:both;
  7. }


 
2-3 choses seraient à revoir:
- il n'y a pas de sens à mettre le top et le menu du haut en float
- beaucoup trop de div (genre celui de l'entremenu

Reply

Marsh Posté le 20-02-2006 à 22:24:50    

Merci des conseils.
 
J'avoue ne pas tout comprendre Pitsy, mais le coup du clear:both ca marche :D
 
Je regarderai ca de plus pret demain, je fatigue la !
 
Encore merci :)

Reply

Marsh Posté le 20-02-2006 à 22:45:54    

border s'utilise de la facon suivante :  
border:Taillepx type couleur
 
ex: border: 1px solid #cccccc ;

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed