28219 sujets

CSS et mise en forme, CSS3

Problème d'image en float sur IE

Bonjour à tous,

J'ai effectué une recherche sur le net et le forum, mais à chaque fois, je trouve la réponse inverse à ma question. C'est le cas dans la faq :

(edit de modérateur)
Comment éviter que mes éléments flottants (float) dépassent de leur conteneur ?

J'ai un logo que je veux faire dépasser de son conteneur. Aucun problème sous les autres navigateurs, mais sous IE l'image fixe la taille du conteneur.

Ai-je un moyen de faire adopter à IE le même comportement ?

Le lien vers la page : http://www.luneo.org/temp/cati/

Merci à tous pour votre aide :jap:

Le code xhtml de la page (ne faites pas attention, c'est pas propre du tout, c'est brut de fonderie) :

// supprimé
Modifié par Luneo (18 May 2007 - 08:56)
Administrateur
Hello,

J'ai édité ton lien pour qu'il ne déforme pas le forum en raison de sa longueur Smiley cligne
D'après ce que je lis :

a écrit :
Il n'existe aucun autre moyen de ramener la valeur de hasLayout à la valeur false que de supprimer la propriété CSS qui avait auparavant entraîné le hasLayout = true.


Donc d'après ce que j'ai compris, c'est le height du div conteneur qui me fait passer en hasLayout=true. Effectivement je je le retire, le rendu est identique sur IE et firefox.

Mais pour fixer une hauteur à ce contenu, et donc avoir un border-bottom, comment je peux faire ?

Là j'ai mis un gif transparent d'un pixel de largeur et la bonne hauteur, mais c'est sale Smiley confused
Luneo a écrit :
Mais pour fixer une hauteur à ce contenu, et donc avoir un border-bottom, comment je peux faire ?

Il n'y a pas besoin de hauteur fixe pour utiliser la propriété CSS border-bottom.

À quoi servait exactement la hauteur ? À avoir une hauteur minimale pour les blocs ? Dans ce cas, on pourra utiliser la propriété CSS min-height avec les navigateurs récents, dont IE7 (mais pas IE6).

Les solutions à apporter dépendront de ce que tu veux réaliser exactement. N'hésite pas à nous le présenter plus en détail si tu as besoin d'un conseil ou d'un coup de main.
Pardon, j'ai oublié de préciser. Tu peux voir le résultat recherché sur http://www.luneo.org/temp/cati.
Je souhaite avoir un bandeau supérieur, sur lequel je fixe les menus à droite. Et je voudrais que le logo soit à cheval entre ce bandeau et le reste de la page.
Donc pour ça j'avais mis une hauteur inférieure à la taille de l'image placée en float: left.

Et bien sûr je souhaite une compatibilité maximale (notamment avec IE6 qui je suppose est le navigateur le plus répandu ?) Smiley confus
Je pense (si j'ai bien compris ;o) que ceci devrait pouvoir résoudre ton problème :

  #logo {
  left: ...px;
  height: ...px;
  position:absolute;
  top: ...px;
  width: ...px;
  z-index:2;   /* ou plus ... */
  }
Effectivement je n'avais pas pensé au positionnement en absolu !
J'avais pour le moment mis un peu de côté pour me concentrer sur le reste, mais il faut que je corriger ça.

Je vais regarder ta méthode, merci beaucoup Smiley cligne
Sujet clos
Aller à