[CSS] Image décalé par rapport au texte

Résolu/Fermé
Utilisateur anonyme - 20 févr. 2010 à 19:49
 Utilisateur anonyme - 21 févr. 2010 à 10:28
Bonjour,
J'ai un problème en CSS, j'ai un texte, en face duquel est affiché une image, qui a pour propriété float: right;
Sous Firefox, aucun soucis, l'image s'affiche en face du texte : http://screensnapr.com/u/k42xnz.png
Mais sous IE, l'image s'affiche bien en face du texte, mais une ligne en dessous : http://screensnapr.com/u/u4og43.png

Mon CSS :
#topcol{
	width: 100%;
	height: auto;
	background: #FFFFFF;
	text-align: left;
}
#topcol img{
	float: right;
}


Et le HTML :
<div id="topcol">
   Texte
   <a href="#">
	<img src="design/img/mailbox.png" alt="MP" title="Messagerie privée">
   </a>
</div>


Merci d'avance pour votre aide :)
A voir également:

7 réponses

LelLex Messages postés 1628 Date d'inscription mercredi 18 février 2009 Statut Membre Dernière intervention 5 septembre 2012 112
21 févr. 2010 à 00:09
Ton TEXTE doit être dans une balise <p></p>

Ton CSS :
#topcol
{
	width: 100%;
	height: auto;
	background: #FFFFFF;
	clear: both;
}

#topcol p
{
	text-align: left;
	float: left;
}
0
Utilisateur anonyme
21 févr. 2010 à 00:23
Merci de ta réponse LelLex, mais pour le coup, avec ce CSS, je n'ai plus rien du tout, ni sur Firefox, ni sur IE ...
0
LelLex Messages postés 1628 Date d'inscription mercredi 18 février 2009 Statut Membre Dernière intervention 5 septembre 2012 112
21 févr. 2010 à 00:32
Tu as bien mit ton TEXTE entre les balises <p></p> comme ça :
<p>TEXTE</p>
0
math 2000 Messages postés 2605 Date d'inscription dimanche 9 septembre 2007 Statut Membre Dernière intervention 7 mai 2016 404
21 févr. 2010 à 00:53
tu met un id au texte et ensuite tu met la meme position top et left
au texte et à l'image
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Utilisateur anonyme
21 févr. 2010 à 01:24
@LelLex oui, j'ai bien mis mon texte à l'intérieur du bloc <p> ...
@math 2000 je ne vois pas trop ce que tu veux dire, si je leur met la même position, ils se trouveront au même endroit ...
0
notobe Messages postés 1952 Date d'inscription mercredi 11 novembre 2009 Statut Membre Dernière intervention 8 juillet 2011 213
21 févr. 2010 à 09:54
L'élément flottant doit être placé en premier dans le flux. Il faut donc mettre le texte après l'image.

<div id="topcol">
     <p><a href="#">
	<img src="design/img/mailbox.png" alt="MP" title="Messagerie privée">
   </a></p>
<p>Texte</p>
</div>


0
Utilisateur anonyme
21 févr. 2010 à 10:28
Merci notobe, effectivement ça fonctionne bien comme ça :)
0