[Résolu] Problème de mise en page en colonne sous IE

Problème de mise en page en colonne sous IE [Résolu] - HTML/CSS - Programmation

Marsh Posté le 08-03-2004 à 23:15:31    

Bonjour,
 
J'ai un petit soucis quand je veux mettre un document en page avec deux colonnes sous IE (sous Mozilla, tout va bien dans le meilleur des mondes).
 
Voici le code CSS que j'utilise:

Code :
  1. div#sous_menu {
  2. float: left;
  3. width: 200px;
  4. }
  6. div#news_body {
  7. margin-left: 205px;
  8. }


 
et le code HTML est du type:

Code :
  1. <div id="sous_menu">
  2. .........
  3. </div>
  5. <div id="news_body">
  6. ......
  7. </div>


 
Et voila ce que j'obtiens sous IE:
http://users.skynet.be/bk372655/problem_under_ie.png
En gros, sous mozilla le tableaux est bien aligné sur le haut du div et sourtout à la même hauteur que mon le début du formulaire de la colonne de gauche. Tandis que sous IE, bernic, il l'aligne sur la fin du formulaire.
 
Merci pour votre aide.
 
Pluton


Message édité par souljacker le 08-03-2004 à 23:32:25
Reply

Marsh Posté le 08-03-2004 à 23:15:31   

Reply

Marsh Posté le 08-03-2004 à 23:21:15    

bon ... voici la version que j'utiliserais plutot:
CSS:

Code :
  1. div#sous_menu {
  2. position: absolute;
  3. left: 0;
  4. width: 200px; }
  6. div#news_body {
  7. width: 100%;
  8. padding-left: 205px;
  9. }


HTML:

Code :
  1. <div id="sous_menu">
  2. .........
  3. </div>
  5. <div id="news_body">
  6. ......
  7. </div>

 
 
J'ai pas tester ce code, mais en théorie, il va te creer une colone a gauche de 200 px  
et une colonne qui te prend le reste de l'ecran ... :)


---------------
Tout n'est descriptible que du point de vue de l'observateur, donc sûrement faux pour le reste du monde.
Reply

Marsh Posté le 08-03-2004 à 23:32:00    

Merci, ca fonctionne nickel.
 
Juste une précision, si tu mets un width: 100px avec un padding, IE et mozilla te font une addition des deux et donc tu obtiens un scrolling horizontale. C'est un problème que j'avais déjà repérer auparavant (partageons les bugs ;) ).
 
J'ai une tendance à oublier l'utiler du position: absolute, faudrait que je me l'ancre dans la tête.

Reply

Sujets relatifs:

Leave a Replay

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