Version imprimable
EDIT : Nouveau problème post #9
Bonjour,
Je suis en train de créer un site basé sur du CSS. Dans Firefox tout se passe bien, le pied! Sous IE quand je fais tourner la souris 2-3 fois sur l'écran j'ai la moitié de la page qui disparaît! Est-ce un bug connu? Une solution à cela?
J'ai validé mon CSS par le W3C donc Microsoft devrait un peu tenir compte des spécifications pour une fois ce serait sympa!
Merci pour votre aide.
webrider.
Tu parles d'utiliser la mollette de la souris pour scroller ?
J'ai deja eu ce problème.
Il doit s'agir de Peekaboo...
http://www.positioniseverything.net/.../peekaboo.html
En fait je n'ai même pas besoin de scroller, seulement faire aller la souris d'un bout à l'autre de l'écran.
En tous cas ça ressemble fort au lien que tu m'as donné, je vais essayer leurs conseils pour contourner ce bug et je te tiens au courant.
Merci! :D
Le bug proviendrait des éléments flottants que IE ne rend pas convenablement. Méfiez-vous donc des validations CSS : votre CSS peut être valide et ne pas fonctionner sous IE car il ne respecte pas complètement les spécifications!
J'ai essayé les solutions proposées sur les différents sites que j'ai visité (dont ton lien) mais rien n'a pu régler mon problème. Et d'un autre côté je ne peux pas me passer des "float" !
C'est quand même chiant cette guéguerre des navigateurs!
Je crois que je vais recréer mon site en utilisant des tableaux pour la mise en forme générale et le CSS pour le texte et les images, à moins qu'il n'y ai une autre solution?
@++
webrider.
MAIS T'ES PAS FOU !!! :evilred: :sm: :pan: :scarymov: :zekill:Citation:
Je crois que je vais recréer mon site en utilisant des tableaux pour la mise en forme générale et le CSS pour le texte et les images, à moins qu'il n'y ai une autre solution?
:mrgreen:
Montre nous ce que tu as fais ;-)
Je voudrais bien montrer ce que j'ai fait mais c'est sur mon serveur local et pas encore de nom de domaine... et puis ce n'est que la mise en page pour l'instant.
Mon CSS fait plus de 200 lignes, ça va pas être vraiment lisible sur le forum...
J'ai fait quelques modifications sur le CSS et pour l'instant c'est stable sous IE mais le résultat n'est pas vraiment celui voulu sous ff. :evilred:
Vachement bizarre que l'un se comporte d'une façon et l'autre d'une autre, ça ne nous facilite pas le travail!! :traine:
Je vous tiens au courant de l'évolution du problème et éventuellement les solutions que j'aurai trouvées! ;)
@++
webrider
C'est pour ca qu'il faut toujours penser simple et vérifier sous les navigateurs ta carcasse avant même d'avoir commencé.
Maintenant sans voir ce que tu as fais ca va être difficile d'en dire plus.
Tu peux mettre tes fichiers de codes en pièces jointes si besoin ;)
++
Merci à tous pour vos réponses! J'ai trouvé une solution pour IE qui ne fonctionne pas sous ff maintenant!!
En fait, pour régler le problème qui est dû aux "float" avec IE, j'ai mis mes boites de type float dans un une autre boite mère non float. C'est ce qui était indiqué de faire dans le lien ici plus haut. Cela fonctionne bien mais ça casse ma présentation avec ff!!
Ce que j'essaie de faire c'est une présentation de produits pour un site e-commerce avec une image à gauche et une description à droite.
Voici un bout de HTML pour présenter le problème :
Et le code CSS :Code:
2
3
4
5
6
7
8
9
10
11
12
Sous IE, les deux boites sont dans la boîte mère mais dans ff les deux boites sont en dehors et l'alignement est plus que bizarre.Code:
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
Je n'ai pas de screenshot car aucun soft de ce type installé sur la machine :cry: .
Une idée de ce que j'aurais zappé?
Merci!
T'es sous Linux? Kde? Tu peux installer ksnapshot si tu veux faire des screens ;)Citation:
Envoyé par webrider
++
Je développe sous windows (PHPEdit) mais le serveur est sous Linux (Gnome). 8-)
Pas d'idée sur mon problème?
Vraiment personne? Pas la moindre idée?
Je commence à me sentir seul face à ce problème. :cry:
je pense que ceci va régler ton problème
la propriété clear right indique que tu refuses tout élément sur la droite de ton élément, En conséquence de quoi, ca te fais passer à la ligne...Code:
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20#boite_produit_img { width: auto; height: auto; float: left; margin-right: 10%; padding: 5px; border: none; } #boite_produit_desc { width: auto; min-width: 30%; height: auto; float: left; clear: right; margin: 0; padding: 5px; border: 1px solid #ccc; text-align: center; }
Merci beaucoup pour cette solution, malheureusement ça n'a aucun effet sur le problème d'affichage. J'avoue ne pas comprendre que ff ne sait pas mettre une boîte dans une autre...
Après un bug sous ie, aurais-je découvert un bug sous ff? 8O
Bonne soirée,
webrider.
Voilà les captures d'écran, je pense que c'est très parlant! :D
Encore merci pour votre aide!
webrider
Salut,
Tes screenshots m'ont permis de mieux comprendre ton problème (je pense)
Tout d'abord, le comportement de firefox est le bon, sur ce coup, c'est ie qui bug
Un élément en float (ou positionné en absolu) sort du flux normal de la page. Il est donc tout à fait normal qu'un élément en float ne puisse pas être pris en compte pour déterminer la taille de l'élément parent.
L'astuce consiste donc a placer un élément qui reste dans le flux mais qui se positionne obligatoirement après l'élément en float.
Voilà ce que je te propose:
HTML:
CSS:Code:
2
3
4
5
Code:
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
Génial résultat impecable sous ie et ff!!
Je suis soulagé, je ne devrai pas changer toute la mise en page de mon site.
Merci à tous les intervenants et surtout à toi MasterOfChakhaL qui m'a donné THE solution. :D :D
@++,
webrider 8-)