28173 sujets

CSS et mise en forme, CSS3

Probleme float + ie

Bonjour,
je souhaite avoir le même résultat que sous firefox de cette page sous IE :
http://gildas.quemener.free.fr/test/template1.html

Voici la source:

<html>
<head><title>Problème avec float sous IE</title>
<style type="text/css"><!--
#tp1image1{
	width : 320px;
	height : 240px;
	border : 1px solid black;
	float : left;
	margin : 5px;

}
#tp1image2{
	width : 320px;
	height : 240px;
	border : 1px solid black;
	float : right;
	margin : 5px;

}
#tp1content{
	width : 650px;
}
-->
</style>
</head>
<body><h1>{titre}</h1>
<p>
	<div id="tp1content">
		<div id="tp1image1">{image1}</div>
		<div id="tp1image2">{image2}</div>

		<div id="tp1image1">{image3}</div>
		Lorem ipsum dolor sit amet, phasellus venenatis scelerisque nunc purus volutpat, posuere omnis tortor consectetuer sed per, ipsum nulla cursus, ut sed posuere wisi mauris vel magnis. Maecenas quam vel vel wisi suspendisse luctus, tempus metus urna integer, sem in in tempor sit cursus, ut posuere nibh convallis praesent. Ullamcorper urna adipiscing metus, nisl tincidunt in nullam hac tincidunt morbi, at pellentesque donec vel, neque convallis lobortis est feugiat ipsum, bibendum commodo proin. Curabitur libero adipiscing erat lacus suspendisse, sed eu risus vitae sodales egestas massa, lorem velit donec vestibulum vitae cras, rutrum parturient nostra faucibus dui non leo, tellus velit et amet. Nibh odio metus arcu, et quis amet mauris pede ut. Dignissim ipsum, aenean vitae erat quam nunc, sit sed facilisi non felis aenean, in urna, primis tempus semper non magna pharetra.

		Augue vitae, nulla cursus sit nulla semper, ac interdum nullam odio dignissim voluptatem rutrum. Tincidunt ullamcorper egestas eget vestibulum aliquet, officia rhoncus, morbi libero eleifend eu justo ullamcorper suscipit. Vestibulum imperdiet aliquam. Lorem eget platea, ante feugiat in libero parturient scelerisque velit, ornare imperdiet vulputate libero. Quam integer faucibus blandit malesuada arcu malesuada, nibh molestie curabitur wisi vulputate mollit etiam, tristique lobortis luctus, vivamus orci quam pharetra, adipiscing et dui eu. In amet pede elit ipsum orci non, magna leo, facilisi commodo quis. Massa lectus quisque vivamus dui, fringilla sodales lorem natoque eu. Pretium quis eu velit cum ultricies sem, erat dolor et cursus, curabitur malesuada in nunc felis blandit, quam molestie quam nisl in quam velit. Mauris sed facilisi nunc nulla. Fermentum nascetur, fermentum mus amet velit ligula quis per, conubia gravida vel a, ligula dis penatibus tempus nibh, diam nullam et.

		Fames ligula pulvinar eros fermentum, porta suscipit et felis, pariatur montes wisi. Nullam ullamcorper egestas vitae felis, erat velit volutpat euismod vestibulum tincidunt cupidatat, curabitur auctor, luctus et id mi, odio rhoncus magna. Wisi ultricies turpis tempus dolor, neque eros eu donec sed sed congue, quisque amet eleifend. Id sed risus quam suscipit dapibus lobortis, gravida vitae, eget lectus ullamcorper laoreet. Urna etiam cursus fringilla similique, ante eu lorem tellus nec, magna litora convallis proin enim amet. Odio nibh enim vulputate, urna eu nisl donec, felis accumsan, eros vel. Massa arcu viverra a ut sed dolor, imperdiet sed, risus magna lectus, magnis est nisl lectus congue auctor eget. Dignissim non in et ante, lacinia condimentum mattis quis, imperdiet ultricies, nunc rhoncus quam. Vel nulla hymenaeos.

		Venenatis tellus dolor id neque tristique cursus, vero nec in, phasellus posuere ac, ornare libero vulputate urna class rutrum erat, cum sit. Wisi donec purus, lacus ullamcorper. Quaerat massa eleifend eget nonummy tincidunt. Nulla venenatis ante pellentesque quisque risus. Felis diam ipsum quisque a erat vulputate, placerat fames, id sem, mauris blandit praesent eros duis.
	</div>
</p>
</body>
</html>


Quelqu'un pourrait-il m'aiguiller?

Merci

EDIT
Pour faire plus simple, voici ce que j'essaye de faire :
http://gildas.quemener.free.fr/test/template1.gif
Modifié par SAaD44 (17 May 2007 - 18:58)
Salut,

Déja tu devrais mettre un doctype à ton document et le valider ensuite.

Une fois ceci ajouté, tu pourras constater au validateur que ton code n'est pas valide, car tes balises <p> contiennent des <div>. Or la spécificité de la balise <p> est qu'elle est une balise de type block, mais c'est la seule qui ne peut contenir que des balises en ligne. Il faudrait donc supprimer ces balises autour de ton contenu. Par contre elles vont très bien autour du texte. Smiley cligne
Modifié par Mikachu (24 May 2007 - 16:00)
Sujet clos
Aller à