Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
1493 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  [HTML/CSS] width="100%" sous IE et Mozilla...

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

[HTML/CSS] width="100%" sous IE et Mozilla...

n°546913
impulse
Posté le 22-10-2003 à 11:34:42  profilanswer
 

Je commence a en avoir ras le bol de ces differences entre Mozilla et IE. Rien ne fonctionne de la meme façon, chaque browser possede ses propres parametres par defaut et des qu'on veut utiliser les CSS on peut etre sur que des problemes vont apparaitre. :(
 
Bon, ça y est je suis soulagé.
 
Qqun pourrait me dire comment faire comprendre a IE que mes 2 DIV ('leftmenu' et 'content') doivent occuper toute la page (100%)? Mozilla comprend tres bien ça mais IE a du mal. Quand je lui dis que la largeur de 'content' doit etre de 100%, je veux bien sur dire que la largeur doit etre egale a 100% de la largeur restante et bien sur lui me mets une largeur de 100% = largeur de page ce qui fait que j'ai une scrollbar en bas de page. :o

mood
Publicité
Posté le 22-10-2003 à 11:34:42  profilanswer
 

n°546922
Hermes le ​Messager
Breton Quiétiste
Posté le 22-10-2003 à 11:38:17  profilanswer
 

Un div global de 100%
 
deux divs à l'intérieur de 50% ou encore : 20% et 80%
 

n°546925
impulse
Posté le 22-10-2003 à 11:41:37  profilanswer
 

J'ai essaye mais je vois pas comment faire pour englober dans des DIV sans tout casser. Il me faut une hauteur de 100% + une largeur de 100% + un header fixe et un menu a gauche fixe (quel merde d'ailleurs pour faire ça sous IE, a quand le support des position:fixed...).

n°546941
Hermes le ​Messager
Breton Quiétiste
Posté le 22-10-2003 à 12:02:27  profilanswer
 

et ça c'est quoi ?  :sarcastic:  
 

Code :
  1. <?xml version="1.0" encoding="iso-8859-1"?>
  2. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <head>
  5. <meta http-equiv="content-type" content="text/html;charset=iso-8859-1" />
  6. <title>index-test</title>
  7. <link href="test.css" rel="stylesheet" media="screen" />
  8. </head>
  9. <body>
  10. <div class="global">
  11. <div class="header">
  12. </div>
  13. <div class="gauche">
  14. menu<br />
  15. menu<br />
  16. menu<br />
  17. menu<br />
  18. menu<br />
  19. menu<br />
  20. menu<br />
  21. menu<br />
  22. menu
  23. </div>
  24. <div class="droite">
  25. contenu<br />
  26. contenu<br />
  27. contenu<br />
  28. contenu<br />
  29. contenu<br />
  30. contenu<br />
  31. contenu<br />
  32. contenu<br />
  33. contenu<br />
  34. contenu<br />
  35. contenu<br />
  36. contenu<br />
  37. contenu<br />
  38. contenu<br />
  39. contenu<br />
  40. contenu<br />
  41. contenu<br />
  42. contenu<br />
  43. contenu<br />
  44. contenu
  45. </div>
  46. </div>
  47. </body>
  48. </html>


 
la feuille de style :
 

Code :
  1. html,body
  2. {
  3. width : 100%;
  4. height : 100%;
  5. margin : 0px;
  6. padding : 0px;
  7. background-color : Silver;
  8. }
  9. .global
  10. {
  11. width : 100%;
  12. height : 100%;
  13. }
  14. .header
  15. {
  16. width : 100%;
  17. height : 100px;
  18. background-color : Olive;
  19. }
  20. .gauche
  21. {
  22. width : 200px;
  23. height : auto;
  24. left : 0px;
  25. background-color : Red;
  26. position : absolute;
  27. }
  28. .droite
  29. {
  30. width : auto;
  31. height : auto;
  32. margin : 0px 0px 0px 200px;
  33. background-color : Yellow;
  34. }


Message édité par Hermes le Messager le 22-10-2003 à 12:05:14
n°546950
impulse
Posté le 22-10-2003 à 12:17:06  profilanswer
 

Citation :

et ça c'est quoi ?  :sarcastic:  
...


 
C'est un truc qui marche tres bien quand t'as pas un 'header' et un 'gauche' fixe... :sarcastic:

n°546955
Hermes le ​Messager
Breton Quiétiste
Posté le 22-10-2003 à 12:21:16  profilanswer
 

Comment ça fixe ? Mon header et mon gauche sont fixes ! Si tu n'es pas capable d'expliquer ce que tu veux exactement, je vois mal comment on pourra t'aider...

n°546958
impulse
Posté le 22-10-2003 à 12:31:29  profilanswer
 

Citation :

Comment ça fixe ? Mon header et mon gauche sont fixes ! Si tu n'es pas capable d'expliquer ce que tu veux exactement, je vois mal comment on pourra t'aider...


 
Tu ne connais pas position: fixed?
 
Exemple : le rectangle bleu est fixe sur ce site =>
http://www.mark.ac/help/sticky.html


Message édité par impulse le 22-10-2003 à 12:31:44
n°546961
urd-sama
waste of space
Posté le 22-10-2003 à 12:36:36  profilanswer
 

cai trai mal ca  [:lacuna coil]

n°546962
impulse
Posté le 22-10-2003 à 12:38:12  profilanswer
 

Citation :

cai trai mal ca


 
Tu peux m'expliquer pourquoi?

n°546968
Hermes le ​Messager
Breton Quiétiste
Posté le 22-10-2003 à 12:41:51  profilanswer
 

Si tu veux réaliser des frames sans frames en CSS, c'est bcp plus compliqué que cela. C'est comme ça que tu aurais du présenter ta question.
Il y a deux grandes possibilités :
 
1) Le javascript pour IE et les CSS pour Moz, puisque IE ne supporte pas le position fixe.
 
2) Les hack css, et t'imprégner des travaux que l'on a réalisé sur la question sempiternelle.
 
http://forum.hardware.fr/forum2.ph [...] h=&subcat=
 
et aussi ici :
 
http://forum.hardware.fr/forum2.ph [...] h=&subcat=

mood
Publicité
Posté le 22-10-2003 à 12:41:51  profilanswer
 

n°546970
urd-sama
waste of space
Posté le 22-10-2003 à 12:42:25  profilanswer
 

impulse a écrit :

Citation :

cai trai mal ca


Tu peux m'expliquer pourquoi?


c'est moche  [:spamafote]

n°546976
KrzAramis
Help Me
Posté le 22-10-2003 à 12:46:13  profilanswer
 

impulse a écrit :

Citation :

Comment ça fixe ? Mon header et mon gauche sont fixes ! Si tu n'es pas capable d'expliquer ce que tu veux exactement, je vois mal comment on pourra t'aider...


 
Tu ne connais pas position: fixed?
 
Exemple : le rectangle bleu est fixe sur ce site =>
http://www.mark.ac/help/sticky.html


 
Moi j y connais rien en HTML  :o , mais ton site quand tu surf en fenetrer il n y a pas de fin  :sweat: . tu peux faire scroler a l infinit. Le script arrete le scroll uniquement en plein ecran. Je trouve la navigation desagreable car le movement du menu de gauche est saccader. Bref techniquement c est interressant mais niveau conford c est nul  :na: .
 
Voila c est mon avis a moi tout seul et je le partage.
 
@++


---------------
The Only Way for Evils to Triumph is for Good Men to do Nothing @->-- Cours Réseaux@->-- Mon Site
n°546983
urd-sama
waste of space
Posté le 22-10-2003 à 12:53:36  profilanswer
 

krzAramis a écrit :


Voila c est mon avis a moi tout seul et je le partage.


ben non t'es pas tout seul [:bisou]

n°546985
KrzAramis
Help Me
Posté le 22-10-2003 à 12:56:45  profilanswer
 

Urd-sama a écrit :


ben non t'es pas tout seul [:wormskiller]


 
Merci mais j ai pris trop de temps pour rediger mon message donc j ai pas vu que j etais pas seul. Desole!  :whistle:  
 
@++
 
Aramis trop lent le matin


---------------
The Only Way for Evils to Triumph is for Good Men to do Nothing @->-- Cours Réseaux@->-- Mon Site
n°547058
cerel
Posté le 22-10-2003 à 13:47:58  profilanswer
 

impulse : la faute en revien a IE, qui ne comprends pas bien la position en fixe.
Malheuresement il n'existe pas de solution facile.
Neanmoins je te conseille de lire cet article :
http://openweb.eu.org/articles/initiation_absolue/
 
De plus c'est un excelent site sur les CSS et le XHTML
 
krzAramis :
Les problemes que tu evoque ne concernent qu'IE, l'auteur de la page a du ruser afin d'obtenir le resultat voulu, il a du utiliser du javascript pour simuler une position en fixe. De plus le fait que tu puisse scroller jusqu'a l'infini, est "normal". Car si la fenetre n'est pas assez grande pour afficher le menu en entier, alors le navigateur veut scroller plus bas pour afficher le reste.
Mais lorsque tu scroll, le menu est repositionne, donc le navigateur le pourra jamais voir le bas du menu, donc scroll a l'infini.
La page fonctionne sans probleme sous Firebird 0.7 :P


Message édité par cerel le 22-10-2003 à 13:51:25
n°547070
fastclemmy
(re-)Dictateur en plastique
Posté le 22-10-2003 à 13:55:09  profilanswer
 

<justecommeça>
Pourquoi ne pas faire un <div> en position absolue à gauche et un <div> à droite avec un overflow scroll ?
</justecommeça>

n°547083
impulse
Posté le 22-10-2003 à 13:58:21  profilanswer
 

Bon alors premierement j'ai trouvé une solution pour emuler la position fixe sous IE. Mon pb ne se situe pas la.
 
Deuxiemement pour ceux qui trouvent que les positions fixes sont inutiles/moches =>  
 
1. avec un vrai browser (Mozilla, Firebird et cie) il n'y a rien de "moche"
2. c'est tres utile pour une appli web (menu toujours visible par exemple). Faudrait peut etre comprendre qu'on a pas tous les meme besoins et que je suis pas forcement en train de faire un site perso
 
PS : j'ai utilisé la methode décrite sur ce site => http://devnull.tagsoup.com/fixed/


Message édité par impulse le 22-10-2003 à 13:59:27
n°547087
Hermes le ​Messager
Breton Quiétiste
Posté le 22-10-2003 à 14:00:17  profilanswer
 

fastclemmy a écrit :

<justecommeça>
Pourquoi ne pas faire un <div> en position absolue à gauche et un <div> à droite avec un overflow scroll ?
</justecommeça>


 
Parce qu'il veut une hauteur en % ainsi qu'une largeur en % pour vraiment simuler des frames, comme dans le défit que j'avais lancé, souviens-toi. ;)
 
Si on veut fonctionner en % avec une partie avec des dimensions fixes, c'est la merde.  :)

n°547088
urd-sama
waste of space
Posté le 22-10-2003 à 14:00:50  profilanswer
 

1. ouais mais ces browser sont minoritaires malheureusement :/
2. pas de prob, mais en général une page ne devrait pas être très haute, c'est pour ca que je trouve relativement inutile.
 
ps: je compattis si tu fais du boulot pour des tiers, du boulot à la con j'en ai chaque jour

n°547096
impulse
Posté le 22-10-2003 à 14:06:30  profilanswer
 

Citation :

1. ouais mais ces browser sont minoritaires malheureusement
2. pas de prob, mais en général une page ne devrait pas être très haute, c'est pour ca que je trouve relativement inutile.
 
ps: je compattis si tu fais du boulot pour des tiers, du boulot à la con j'en ai chaque jour


 
1. en fait mon appli doit etre utilisable sous IE 6.0, c'est plutot limité (tant mieux). Cependant j'utilise Mozilla et je ne veux pas dev un site qui ne fonctionne pas sous Mozilla (d'ailleurs je n'ai pas encore eu le moindre pb avec Mozilla, c'est IE qui pose pb a chaque fois).
 
2. tout a fait d'accord en ce qui concerne la taille de la scrollbar. Je me souviens d'ailleurs d'un prof de web qui me disait "les scrollbars ne devraient pas exister, si j'en vois une seule sur votre site je vous colle un zero". Seulement la je dois tout afficher sur une page (imagine la taille de la scrollbar quand j'affiche 2000 icones sur une page...).

n°547100
urd-sama
waste of space
Posté le 22-10-2003 à 14:08:49  profilanswer
 

je m'incline :jap:
mais sans savoir tout ces détails on peut juger que tu te casse le cul pour rien :D

n°547108
impulse
Posté le 22-10-2003 à 14:15:35  profilanswer
 

Citation :

je m'incline :jap:
mais sans savoir tout ces détails on peut juger que tu te casse le cul pour rien :D


 
En fait j'ai presque reussi a obtenir ce que je veux au niveau de l'interface. Il me reste encore des trucs a regler mais ce sont des details. Le dev web c'est vraiment un truc a s'arracher les cheveux des fois (j'ose meme pas imaginer les pb que j'aurais si j'avais plus de contraintes genre support de Netscape, Lynx et cie...).

n°547119
Hermes le ​Messager
Breton Quiétiste
Posté le 22-10-2003 à 14:23:01  profilanswer
 

impulse a écrit :

Citation :

je m'incline :jap:
mais sans savoir tout ces détails on peut juger que tu te casse le cul pour rien :D


 
En fait j'ai presque reussi a obtenir ce que je veux au niveau de l'interface. Il me reste encore des trucs a regler mais ce sont des details. Le dev web c'est vraiment un truc a s'arracher les cheveux des fois (j'ose meme pas imaginer les pb que j'aurais si j'avais plus de contraintes genre support de Netscape, Lynx et cie...).


 
Pas forcément en fait. Pour tout ce qui est Lynx et cie, il faut juste que toutes les infos soient bien dispos et placées hiérachiquement et logiquement dans la page.
 
C'est quand tu cherches à avoir le même résultat "graphiquement" entre plusieurs navigateurs récents que c'est compliqué. ;)
 
Pour avoir vraiment la même chose sous IE 5+, Moz 1+, Netscape 6+ et Opera 6+, c'est déjà coton dans certains cas.  :)

n°547135
impulse
Posté le 22-10-2003 à 14:28:45  profilanswer
 

Hermes > j'ai regarde ta solution (cf lien vers le topic que tu as donné) pour un header+footer fixes (avec taille fixe). Le seul probleme c'est que sous Mozilla 1.4/win la roulette ne fonctionne pas avec ton code (pas de pb sous IE)...

n°547143
fastclemmy
(re-)Dictateur en plastique
Posté le 22-10-2003 à 14:31:50  profilanswer
 

impulse a écrit :

Hermes > j'ai regarde ta solution (cf lien vers le topic que tu as donné) pour un header+footer fixes (avec taille fixe). Le seul probleme c'est que sous Mozilla 1.4/win la roulette ne fonctionne pas avec ton code (pas de pb sous IE)...


 
Ca c'est un bug de Mozilla [:spamafote] (je crois résolu avec FB 0.7 et Mozilla 1.5 à confirmer)

mood
Publicité
Posté le   profilanswer
 


Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  [HTML/CSS] width="100%" sous IE et Mozilla...

 

Sujets relatifs
désactiver la modification du code HTML et CSS avec ASP.NET[HTML]Faire un lien "_blank" mais en full screen
[html/css] bold mais pas bold :/HTML --> PHP ==> Parse error !
[HTML/JS] Changer le contenu d'un div[html] Tableau redimensionnement automatique
[HTML/PHP] petit problème d'accent[HTML] Tableau dans une cellule de hauteur 100% de la cellule
[HTML/CSS] petit probleme de transparence... 
Plus de sujets relatifs à : [HTML/CSS] width="100%" sous IE et Mozilla...


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR