FORUM Tom's Hardware » Programmation » HTML / Javascript » Résolu... - Autre problème de décalage :)
 

Résolu... - Autre problème de décalage :)

Il y a 496 utilisateurs connus et inconnus. Pour voir la liste des connectés connus, cliquez ici
Ajouter une réponse



 Mot :   Pseudo :  
 
Bas de page
Auteur
 Sujet : Résolu... - Autre problème de décalage :)
 
Kaoru@IDN
Plus d'informations
n°35129
31-08-2007 à 11:04:33

Bon me revoila plus vite que mon ombre...
Surement encore une couillonerie mais bon.

pour index :

Code :
  1. <body>
  2. <div id="conteneur">
  4. <div id="banner">
  5. </div>
  7. <div id="banner2">
  8. <div id="navigationtop">
  9. <ul>
  10. <li><a href="#">Testing</a></li>
  11. <li><a href="#">Training</a></li>
  12. <li><a href="#">Coaching</a></li>
  13. <li><a href="#">Consultancy</a></li>
  14. </ul>
  15. </div>
  16. <img src="images/banner2.png" class="baniole" alt="image bannière"/>
  17. </div>
  19. <div id="menu">
  20. <div id="navigationmenu">
  21. <ul>
  22. <li><a href="#">LIENS 1</a></li>
  23. <li><a href="#">LIENS 2</a></li>
  24. <li><a href="#">LIENS 3</a></li>
  25. <li><a href="#">LIENS 4</a></li>
  26. </ul>
  27. </div>
  28. </div>
  30. <div id="contenu">
  31. mmm
  32. </div>
  34. <div id="footer">
  35. </div>
  37. </div>
  38. </body>



pour le css :

Code :
  1. body {
  2.     padding:0px;
  3.     margin:0px;
  4.     background-image:url(images/fond.png);
  5.     background-repeat:repeat-x;
  6. }
  8. #conteneur {
  9.     width:712px;
  10.     background-color:#999999;
  11.     margin:auto;
  12. }
  14. #banner {
  15.     width:100%;
  16.     height:100px;
  17.     background-image:url(images/banner1.png);
  18.     background-repeat:no-repeat;
  19. }
  21. #banner2 {
  22.     width:100%;
  23.     height:150px;
  24.     background-color:#BFC3DC;
  25. }
  27. #menu {
  28.     width:150px;
  29.     height:250px;
  30.     background-color:#FF0000;
  31.     float:left;
  32. }
  34. #contenu {
  35.     width:562px;
  36.     margin-left:150px;
  37.     background-color:#009900;
  38. }
  40. #footer {
  41.     width:100%;
  42.     height:20px;
  43.     background-color:#FFFF00;
  44. }
  46. .baniole {
  47.     width:600px;
  48.     height:125px;
  49.     margin-left:56px;
  50. }
  52. #navigationtop {
  53.     font-family:Arial, Helvetica, sans-serif;
  54.     font-size:14px;
  55.     font-weight:bold;
  56. }
  58. #navigationtop ul {
  59.     margin:0px;
  60.     padding:0px;
  61.     margin-bottom:5px;
  62.     margin-left:150px;
  63. }
  65. #navigationtop a {
  66.     text-decoration:none;
  67.     color:#FFFFFF;
  68.     padding-left:10px;
  69.     padding-right:10px;
  70.     background-color:#003579;
  71.     border-bottom:1px solid #BFC3DC;
  72.     border-left:1px solid #BFC3DC;
  73.     border-right:1px solid #BFC3DC;
  74. }
  76. #navigationtop a:hover {
  77.     text-decoration:none;
  78.     color:#000000;
  79.     padding-left:10px;
  80.     padding-right:10px;
  81.     background-color:#BFC3DC;
  82.     border-bottom:1px solid #003579;
  83.     border-left:1px solid #003579;
  84.     border-right:1px solid #003579;
  85. }
  87. #navigationtop li {
  88.     list-style-type:none;
  89.     display:inline;
  90. }
  92. #navigationmenu {
  93.     font-size:14px;
  94.     font-family:Arial, Helvetica, sans-serif;
  95.     font-weight:bold;
  96. }
  98. #navigationmenu ul {
  99.     padding:0px;
  100.     margin:0px;
  101. }
  103. #navigationmenu li {
  104.     list-style-type:none;
  105. }



Le problème :

Sous firefox tout ce passe correctement, mais sous IE le float de mon menu (css -> #menu) ne semble pas fonctionner et balance mon DIV contenu (css -> #contenu) tout en bas et je ne sais pas pourquoi... Surtout que c'est assez simple comme code et il y a peu de chance de faire une erreur de frappe ou autre...

C'est encore surement un machin qui n'est pas trop important, mais bon je n'aime vraiment pas attendre ^^

Quelqu'un sait-il m'aider? merci d'avance !


Message édité par Kaoru@IDN le 31-08-2007 à 12:09:14

Kaoru@IDN
Plus d'informations
n°35130
31-08-2007 à 11:46:48

Voila j'ai un peu changé, ca passe bien sous IE maintenant mais FF me dit zut...

Je ne sais pas si c'est valide, à vous de me le dire, j'ai changé :

Code :
  1. #contenu {
  2.     width:562px;
  3.     margin-left:20px;
  4.     background-color:#BFC3DC;
  5.     float:left;
  6. }



J'ai mis un petit float left et un margin en plus à contenu...

Seulement maintenant que ca va sous IE, FF me dit zut, mon footer se retrouve sous le contenu. Logique pour une float quand même, je commence à m'embrouiller.
Help me please !

Kaoru@IDN
Plus d'informations
n°35131
31-08-2007 à 12:08:33

Et merde j'ai encore solutionné ca tout seul...

Donc j'étais bien parti. Voici le code comme il maintenant (je n'ai modifié que le css) :

Code :
  1. #menu {
  2.     float:left;
  3.     background-color:#5C6AA1;
  4. }
  6. #contenu {
  7.     width:550px;
  8.     margin-left:26px;
  9.     margin-top:15px;
  10.     height:100px;
  11.     float:left;
  12.     background-color:#BFC3DC;
  13. }
  15. #footer {
  16.     background-color:#FFFF00;
  17.     height:25px;
  18.     clear:both;
  19. }



J'ai découvert clear:both aujourd'hui, c'est cool.

zeb
Profil : Modérateur libre
Plus d'informations
n°35134
31-08-2007 à 14:11:50

:)


---------------
Règlement du forum / Règlement de Programmation / Règlement du Monde de Linux euh, n'y en a pas...

Aller à :
Ajouter une réponse
  FORUM Tom's Hardware » Programmation » HTML / Javascript » Résolu... - Autre problème de décalage :)
 

Plan du forum
Forum MesDiscussions.Net, Version 2007.1.2
© 2000-2007 No1Dev
Page générée en 0.392 secondes
Annonces Google
Publicité
Sujets relatifs
voir tout
Actualités relatives

Bourdonnement sur l&#039;Hercules AIW8500DV résolu ?

Publié le 11 September 2002

Nous vous faisions part dans cette news d'un problème de bourdonnement sur la carte Hercules 3D Prophet All In Wonder 8500DV. Hercules a semble-t-il enfin daigné répondre aux clients mécontents Lire la suite

Intel résoud les problèmes de tension du Nehalem

Publié le 19 September 2008

Intel aurait résolu les problèmes de tension entre le chipset X58 et le Nehalem. Lire la suite

Faille de sécurité importante dans Gmail

Publié le 14 January 2005

Alors que Gmail s’annonce comme l’un des plus importants services de messagerie électronique de par son espace de stockage d’un Giga, celui-ci fait aujourd’hui l’actualité en raison d’une faille de sécurité découverte par ses utilisateurs. En effet, il Lire la suite

Le problème de l'iPhone 3G : son chipset

Publié le 14 August 2008

Des analystes de Nomura affirment que les problèmes de connexion 3G de l’iPhone sont dus à un chipset trop jeune d’Infineon. Lire la suite

Les derniers tests
Charts cartes graphiques Q3 2008 : 101 cartes testées

Charts cartes graphiques Q3 2008 : 101 cartes testées

Publié le 29 September 2008

Les charts de 101 cartes graphiques anciennes et récentes sous 9 applications, avec au total 6767 scores. Quel gain attendre du remplacement de votre carte graphique par un nouveau modèle dans chaque application/résolution et en moyenne ? Lire la suite

Upgrader son portable en 9 leçons

Upgrader son portable en 9 leçons

Publié le 29 September 2008

Profiter au mieux de son PC portable en 9 leçons. Lire la suite

Que choisir ? Home Cinema 5.1 ou projecteur de son ?

Que choisir ? Home Cinema 5.1 ou projecteur de son ?

Publié le 25 September 2008

Faut-il craquer pour un ensemble 5.1 ou pour une barre de son ? Découvrez les forces et faiblesses comparées de chaque système. Lire la suite

Intel Core i7 (Nehalem) : une architecture signée AMD ?

Intel Core i7 (Nehalem) : une architecture signée AMD ?

Publié le 25 September 2008

Avec ses nouveaux processeurs Core i7, Intel fait évoluer les Core 2 en reprenant leur architecture, mais en lui rajoutant des technologies dont la plupart semblent avoir leur équivalent direct chez AMD. Impression ou réalité ? Lire la suite

voir tout
Les téléchargements