calque qui reste fixe

calque qui reste fixe - HTML/CSS - Programmation

Marsh Posté le 15-09-2004 à 14:30:04    

j'ai une simple page HTML
 
je veux mettre dans cette page un calque plus ou mons centré
 
j'ai créé ce calque, mais le gros probleme c'est que quand je redimentionne la fenetre Inetrnet Explorer, le calque reste fixe, alros que je voudrais, logiquement, que le calque se decale vers la gauche (notamment pour etre visible normalement en 800*600)
 
j'ai alros trouvé une parade : je créé un calque sans aucun decalage (gauche :0px et sommet:0px) et dedans je met le calque a centrer.
Ainsi le decalage vers la gauche se fait.
 
jespere etre assez clair pour le moment
 
Mais le probleme c'esyt que j'ai testé avec Mozilla, et le calque reste fixe. Ca march etres bien pour I Explroer mais pas pour Mozilla. Je souhiaterais donc savoir comment rendre possible ce decalage auto avec Mozilla
merci
 
pour exemple:
testez avec IE6 puis avec Mozilla (firefox pour moi) l'adresse:
www.kaeron.net
 

Reply

Marsh Posté le 15-09-2004 à 14:30:04   

Reply

Marsh Posté le 15-09-2004 à 21:43:12    

salut,
 
une div centrée :

Code :
  1. <html>
  2. <head>
  3. <title>DIV Centree</title>
  4. <style type=text/css>
  5. body{
  6. background-color: aliceblue;
  7. margin:0px;
  8. }
  9. #cont{
  10.     position:absolute;
  11.     top:50%;
  12.     left:50%;
  13.     margin-left: -250px;
  14.     margin-top: -150px;
  15.     width:500px;
  16.     height:300px;
  17.     padding:0px;
  18.     border:1px solid blue;
  19.     background-color:#E1E1FF;
  20. }
  21. </style>
  22. </head>
  23. <body">
  24. <div id="cont">
  25. </div>
  26. </body>
  27. </html>


 
++
 
L.

Reply

Marsh Posté le 16-09-2004 à 09:58:50    

Leris a écrit :

salut,
 
une div centrée :

Code :
  1. <html>
  2. <head>
  3. <title>DIV Centree</title>
  4. <style type=text/css>
  5. body{
  6. background-color: aliceblue;
  7. margin:0px;
  8. }
  9. #cont{
  10.     position:absolute;
  11.     top:50%;
  12.     left:50%;
  13.     margin-left: -250px;
  14.     margin-top: -150px;
  15.     width:500px;
  16.     height:300px;
  17.     padding:0px;
  18.     border:1px solid blue;
  19.     background-color:#E1E1FF;
  20. }
  21. </style>
  22. </head>
  23. <body">
  24. <div id="cont">
  25. </div>
  26. </body>
  27. </html>


 
++
 
L.


 
Oui mais non. Le calque sera effectivement centré en largeur, mais en hauteur, cela dépendra de la taille du navigateur.


---------------
Expert en expertises
Reply

Marsh Posté le 16-09-2004 à 13:17:03    

merci pour cette astuce
mais mon sujet ne porte pas sur le fait que ca soit centré ou non mais sur le fait que le calque ets fixe et que je vux quil puisse bouger quand on redimentionne la fenetre

Reply

Marsh Posté le 16-09-2004 à 17:53:48    

re,
 
suffit de copier/coller le code !
 
le div est centré en hauteur et en largeur et il le reste si on redimensionne la fenetre !
 
L.

Reply

Marsh Posté le 16-09-2004 à 19:35:45    

Leris a écrit :

re,
 
suffit de copier/coller le code !
 
le div est centré en hauteur et en largeur et il le reste si on redimensionne la fenetre !
 
L.


 
Non.  :o


---------------
Expert en expertises
Reply

Marsh Posté le 16-09-2004 à 21:14:55    

re,
 
sur quelle barque pourrie navigues-tu ?
 
testé sur I.E.6.0 , netscape.7.02 , firefox.0.9.2
 
quelqu'un d'autre a testé ?
 
L.

Reply

Marsh Posté le 17-09-2004 à 18:30:39    

Leris a écrit :

re,
 
sur quelle barque pourrie navigues-tu ?
 
testé sur I.E.6.0 , netscape.7.02 , firefox.0.9.2
 
quelqu'un d'autre a testé ?
 
L.


 
Etant donné que la hauteur d'un navigateur n'est pas fixe, ton système de centrage vertical ne peut pas fonctionner puisque les marges négatives sont exprimées en px.
ça fera un truc à peu près centré sur du 1024/768, point barre...


---------------
Expert en expertises
Reply

Marsh Posté le 17-09-2004 à 19:28:02    

Mais si c'est centré !
La dimension en px, il l'a donne parce que son calque est aussi en pixel (width: 500px; height: 300px; ) !


Message édité par kalex le 17-09-2004 à 19:28:38
Reply

Marsh Posté le 18-09-2004 à 04:27:42    

tres fort le messager ! donc sans essayer tu vois que ça ne fonctionne pas ?
 
les marges sont la uniquement pour "reculer" de la moitié de la hauteur et largeur du calque , la position est 50%.
 
ben dis donc , on en vois de belle sur les forums ...

Reply

Marsh Posté le 18-09-2004 à 04:27:42   

Reply

Marsh Posté le 22-09-2004 à 13:10:32    

merci pour le code
je vais le tester
en attendant pour listoire que le calque reste fixe
j'ai fait nimporte quoi, c'est pas grand chose mais javé mis une ligne background-attachment:fixed.
forcement ca pouvait pas aller
 
vous pouvez tester :
www.kaeron.net avec IE6 et Mozilla et ca marche bien (ya juste un probleme sous Mozilla avec les sous menus des liens à gauche qui'il faut que je resolve mais sinon c bon)


Message édité par jokari34 le 22-09-2004 à 13:11:18
Reply

Marsh Posté le 22-09-2004 à 19:37:06    

jokari34 a écrit :

merci pour le code
je vais le tester
en attendant pour listoire que le calque reste fixe
j'ai fait nimporte quoi, c'est pas grand chose mais javé mis une ligne background-attachment:fixed.
forcement ca pouvait pas aller
 
vous pouvez tester :
www.kaeron.net avec IE6 et Mozilla et ca marche bien (ya juste un probleme sous Mozilla avec les sous menus des liens à gauche qui'il faut que je resolve mais sinon c bon)


 
Chez moi, si j'agrandis la fenêtre verticalement, ça ne centre pas verticalement. ;) Mozilla 1.6 (Linux mandrake 10).


---------------
Expert en expertises
Reply

Marsh Posté le 22-09-2004 à 19:45:55    

hé ben au lieu de tout critiquer , donne ta solution !

Reply

Marsh Posté le 23-09-2004 à 18:38:03    

Leris a écrit :

hé ben au lieu de tout critiquer , donne ta solution !


 
Je ne pense pas qu'il y en ai une qui fonctionne parfaitement (en tous cas, je demande à voir).
 
On pourrait éventuellement jouer avec un tableau de 100% de hauteur et de largeur du body qu'on ferait apparaitre avec un z-index... Je n'ai pas essayé, et je ne suis pas du tout sûr que cela est possible...


---------------
Expert en expertises
Reply

Marsh Posté le 23-09-2004 à 20:21:19    

moi j'ai testé sur I.E.6.0 , netscape.7.02 , firefox.0.9.2  
 
et ça fonctionne impeccable !(peut etre pas sur des systemes "exotiques" comme le tien !)
 
L.

Reply

Marsh Posté le 24-09-2004 à 08:05:51    

Leris a écrit :

moi j'ai testé sur I.E.6.0 , netscape.7.02 , firefox.0.9.2  
 
et ça fonctionne impeccable !(peut etre pas sur des systemes "exotiques" comme le tien !)
 
L.


 
Exemple visible ?

Reply

Marsh Posté le 24-09-2004 à 09:24:59    

mon site marche sous Netscape 7.02 ? c cool.
merci davoir testé, j'ai pas Netscape.
disons que j'ai tendance a chercher la compatibilité que pour IE6, Mozilla et Konqueror (enfin plus ou moins pour lui)
Je me rend compte que Mozill et IE sont en tete des listes et ma foi si je peux faire des choses compatibles aec IE (pas tres strict) et Mozilla (tres strict donc bonne ecole) benb c tout benef

Reply

Marsh Posté le 24-09-2004 à 12:53:02    

re,
 
exemple visible : ICI  
 
L.

Reply

Marsh Posté le 24-09-2004 à 18:28:09    

Leris a écrit :

re,
 
exemple visible : ICI  
 
L.


 
ouai, ben c'est buggé... Si je réduis la fenêtre suffisamment, le bord gauche de la page disparait.  :o


---------------
Expert en expertises
Reply

Marsh Posté le 24-09-2004 à 18:41:54    

trop fort !!!
 
t'as un ecran de 320*240 ???
 
[fin]
 
L.

Reply

Marsh Posté le 24-09-2004 à 18:57:34    

Leris a écrit :

trop fort !!!
 
t'as un ecran de 320*240 ???
 
[fin]
 
L.


 
non, mais si je veux centrer un très gros calque dans la page, le problème reste entier.  :o


---------------
Expert en expertises
Reply

Marsh Posté le 24-09-2004 à 19:33:27    

Hermes le Messager a écrit :

non, mais si je veux centrer un très gros calque dans la page, le problème reste entier.  :o

le problème avec les marges négatives c'est surtout que tu es obligé de connaitre les dimensions de ta boite à centrer, pour le reste, je trouve que c'est pas une si mauvaise solution.


---------------
Celui qui pose une question est idiot 5 minutes. Celui qui n'en pose pas le reste toute sa vie. |  Membre du grand complot pharmaceutico-médico-scientifico-judéo-maçonnique.
Reply

Marsh Posté le 24-09-2004 à 20:25:46    

Mjules a écrit :

le problème avec les marges négatives c'est surtout que tu es obligé de connaitre les dimensions de ta boite à centrer, pour le reste, je trouve que c'est pas une si mauvaise solution.


 
En plus... Tu as tout à fait raison. Du reste je ne dis pas que c'est une "si mauvaise solution", je dis que c'est buggé, et que ce n'est pas LA solution. Il n'y a pas de solution réellement satisfaisante.  :o


---------------
Expert en expertises
Reply

Marsh Posté le    

Reply

Sujets relatifs:

Leave a Replay

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