28221 sujets

CSS et mise en forme, CSS3

Bonjour,

le problème en question : http://da-bulb.com/hugues/index.html

L'ecusson à gauche et le menu horizontal sont en float:left. L'affichage est correct sous FireFox mais pas IE qui décale le menu verticalement.

Je me bats depuis hier, mais pas trouver de solution.

Merci
Modifié par bill_baroud (04 Apr 2006 - 10:50)
Lol, encore un sujet où Raphaël pourrait dire « 75% des sujets sur ce forum portant sur des problèmes de positionnement avec Internet Explorer, merci d'éditer le titre de votre message pour donner quelque chose de plus explicite ».
Je suppose que comme il a déjà dû le faire 10 fois ce matin pour différents messages, il a abandonné à la onzième Smiley lol

Je ne sais pas pourquoi, mais ta page sous linux avec Firefox fait monter le CPU autour de 80% en permanence. Bref, ça rame bien comme il faut. Enfin bon, ça vient peut-être de moi.
Mais je suspecte le bout de flash qui traîne de ne pas y être étranger.

Il me semble également que la syntaxe de tes commentaires conditionnels n'est pas juste.
C'est peut-être ça qui fait turbiner FF.

<!–-[if IE]>

Il faut un point d'exclamation et deux tirets simple. Là, il semblerait que tu aies un titret demi-cadratin (#2013) à la place du premier tiret. En corrigeant ça, ça ira sans doute mieux.

Pour le problème de float, c'est juste que sous IE to menu horizontal est un peu trop large, un truc du genre. Du coup, il passe à la ligne.

Ton image n'est de plus pas visible, car c'est du PNG 32 (avec couche alpha). IE n'aime pas trop (même si la "disparition" d'une image n'est pas un comportement que je connaissais).

Du PNG 8 avec tranparence simple (un pixel est soit opaque, soit transparent) devrait suffire.

Pour le problème de float, je conseille de mettre l'image (dotée d'un attribut alt pour le texte alternatif, merci) en float left, et le menu en positionnement statique (valeur par défaut, pas de float), avec une marge à gauche d'autant de pixels que nécessaire pour ne pas passer sous le flottant.
Administrateur
mpop a écrit :
Lol, encore un sujet où Raphaël pourrait dire « 75% des sujets sur ce forum portant sur des problèmes de positionnement avec Internet Explorer, merci d'éditer le titre de votre message pour donner quelque chose de plus explicite ».

Moui, en général, je rajoute encore "as-tu pensé à suivre la Méthodologie générale" Smiley cligne
Merci pour vos réponses,

oula, un peu space l'alignement à droite !

Il y avait effectivement un problème avec le flash. merci, je n'avais rien remarqué !

L'image était en png24, mais je l'ai passée en jpg finalement...

J'ai compris pour le positionnement du menu, en fait le float sort l'élément du flux, c'est bien ça ?

Au centre, il y a un png transparent (texte ombré), est-ce que tu le vois ? Je ne comprends pas pourquoi cette image ne se cale pas complètement à gauche sous l'écusson, je lui est pourtant attribué un float left ??

Smiley confus
bill_baroud a écrit :
J'ai compris pour le positionnement du menu, en fait le float sort l'élément du flux, c'est bien ça ?

En fait non. Une image flottante "flotte" par dessus les autres blocs (qui s'étendent en dessous d'elle comme si elle n'était pas là), mais repousse les éléments de type en-ligne (le texte, les images, etc.). Donc elle ne sort pas vraiment du flux comme c'est le cas avec le positionnement absolu ou fixé.
Cf cet exemple (à voir avec un navigateur gérant la transparence PNG, ça sera plus clair) :
http://web.covertprestige.info/test/07-colonnes-flottantes-et-place-dans-le-flux.html

À noter qu'Internet Explorer gère parfois un peu bizarrement les flottants... il faudra que je me penche sur le problème.

bill_baroud a écrit :
Au centre, il y a un png transparent (texte ombré), est-ce que tu le vois ? Je ne comprends pas pourquoi cette image ne se cale pas complètement à gauche sous l'écusson, je lui est pourtant attribué un float left ?? Smiley confus

Flottant à gauche ne veut pas dire "tout à gauche". Cf la page dont j'ai donné le lien pour observer le comportement des flottants.

En l'occurence, les flottants flottent par dessus les autres blocs, mais ne peuvent pas se superposer entre eux. Deux éléments flottants à gauche se placeront côte-à-côte tant que leur bloc parent peut les contenir.

Si tu veux que le deuxième bloc passe à la ligne, il suffit de le laisser en positionnement statique (normal, sans float), et peut-être, si besoin, de lui appliquer un clear: left; pour lui demander de passer en dessous des flottants qui se trouvent à sa gauche.

PS: Vive Manu Larcenet Smiley smile
Modifié par mpop (01 Apr 2006 - 18:22)
Bon, je commence a y voir plus clair. Mais les différences de comportements en fonction du navigateur ne facilitent pas la tâche...

Merci pour ton aide. Smiley smile

Le pb est résolu, mais je n'arrive pas à marker le message.
Modifié par bill_baroud (04 Apr 2006 - 10:49)
Bonjour,

Il te suffit d'éditer ton premier post (à l'aide du bouton "Editer" en haut à droite) et de modifier ton titre.