Float:left sous FF, ajouté par tinymce...

23 févr. 2009, 11:47

Bonjour,

J'ai un système de "news" que je peux créer par tinymce sur mon site.

Sur la page d'affichage des news je fais donc simplement un parcours de mes news en base et j'affiche chacune d'entre elles :

while($r=mysql_fetch_assoc($q)) {
				?>
				<div class="une_news">
				<h3><?php echo $r["nom"];?></h3>
				<p><?php echo stripslashes($r["contenu"]);?></p>
				</div>
				<?php
				}

Le problème est que, dans tinymce quand je mets une image à coté de mon texte il me génére un code du style :

Code : Tout sélectionner

<img style=\"float: left;\" src=\".....

Donc sous FF l'image s'affiche mais "par dessus" le reste, c'est à dire que sa hauteur n'est pas prise en compte et ainsi elle déborde sur la news d'en dessous...

Quelqu'un aurait il une solution à ce problème ?

Merci.

23 févr. 2009, 12:05

Il faut nous montrer le code source généré de deux news à la suite par exemple...
Je pense qu'un

Code : Tout sélectionner

clear: left // ou both

judicieusement placé devrait résoudre le problème...
Donc on veut ton code css et le html généré

23 févr. 2009, 12:41

Merci.

Effectivement un clear:both placé dans la div résoud à moitié le problème

Exemple de page générée :

Code : Tout sélectionner

<div class="une_news">
	<h3>Exposition chez Hérisson</h3>
	<h4>mercredi 11 février 2009</h4>
	<p><p>A partir du <strong>3 Mars et jusqu'au 4 Avril 2009</strong>, Les cr&eacute;ations de kaki seront expos&eacute;es dans la boutique H&eacute;risson.</p>
	<p>&nbsp;</p>
	<p><img style="float: left;" src="../web/visuels/herissonbis.jpg" alt="Exposition chez H&eacute;risson" width="167" height="238" /></p>
	<p><span style="\"><strong>SHOW ROOM BOUTIQUE HERISSON<br />17 rue de l'Abb&eacute; Groult, 75015 Paris<br />M&deg; Commerce</strong></span></p>
	<p><span style="\">Du Mardi au Vendredi de 11h00 &agrave; 13h00 et de 14h30 &agrave; 19h30<br />Le samedi de 11h30 &agrave; 19h30</span><br /><span style="\">http://www.herisson-showroom.com/</span></p></p>
</div><br/>
<div class="une_news">
	<h3>Maché des créateurs à Issy les Moulineaux</h3>
	<h4>mercredi 11 février 2009</h4>
	<p><p>Retrouvez les cr&eacute;ations de kaki sur le march&eacute; des cr&eacute;ateurs d'Issy<strong><span style="color: #339966;"> le 16 Mai 2009 </span></strong>&agrave; partir de 10h sur la place de la Marie d'Issy les Moulineaux.</p>
	<p>Plus d'infos sur prochainement.</p></p>
</div><br/>

Donc si je met clear:both dans le div "une_news" ca va bien à la ligne, mais j'ai une bordure bottom pour faire la séparation normalement qui elle reste "sous l'image"

le css (avant le clear):

Code : Tout sélectionner

.une_news {
	margin-left:auto;
	margin-right:auto;
	width:600px;
	border-bottom:1px black solid;
	margin-top:0px;
	padding-top:0px;
	margin-bottom:10px;
}

merci pour ton aide

23 févr. 2009, 13:08

Euh j'ai pas trop compris le coup de la bordure...?
Un screen ou une page en ligne?
Sinon je pencherais pour un

Code : Tout sélectionner

padding-bottom: Xpx;

à voir selon ta réponse

23 févr. 2009, 13:26

En fait la bordure bottom c pour faire l equivalent d'un <hr/>... Mais du coup ça passe pas...

Il vaut mieux faire un <hr/> à ce moment la ?

Merci encore !

[/img]

23 févr. 2009, 14:37

Nonon normalement le border-bottom sur ton div devrait bien se passer...
Tu l'as mis ou le clear: both?
sur la classe .une_news? ou sur le h3 ?

[Note : ce message a été posté de manière anonyme avant d'être réattribué à son auteur]

23 févr. 2009, 15:09

J'ai essayé les deux (l'un, l autre et les deux en meme temps) mais rien n'y fait...

Float:left sous FF, ajouté par tinymce...

Qui est en ligne