Téléchargement
illégal
Posez votre question Signaler

News en php avec image flottante [Résolu]

Arpheus 33Messages postés 4 décembre 2008Date d'inscription 7 octobre 2010Dernière intervention - Dernière réponse le 2 sept. 2009 à 14:06
Bonjour,
Je suis en train de développer un site personnel en XHTML/CSS/PHP/MySQL, et j'ai décidé il y a peu d'y intégrer un système de news fonctionnant avec une base de donnée.
Une interface me permet d'entrer un titre, du texte, et l'url d'une image, le message s'enregistre, et ma page affiche automatiquement les billets.
Le problème que je rencontre se situe dans l'affichage de l'image. Je lui ai attribué une propriété float : right, mais dès lors le cadre de la news ne s'adapte plus à la taille de l'image. Je joint le code qui me permet d'afficher les news. Quelqu'un a t'il une astuce pour adapter la taille de mon cadre à mon image ?
<?php 
	mysql_connect("serveur", "ID", "mdp") ;
	mysql_select_db("bdd");
	$resp = mysql_query("SELECT * FROM billets ORDER BY ID DESC LIMIT 0, 4") or die('Erreur sur la requête : '.$sql.'<br/>'.mysql_error());
	while ($aff = mysql_fetch_array($resp, MYSQL_ASSOC)) { ?>
	<div class="post">
		<img src="bordure-haute.png" alt="bordure" /><br />
		*<img src="img/<?php echo $aff['Date'].'.'.$aff['img']; ?>" alt="" class="accompagnement" />*
		<?php echo date('d/m/Y', $aff['Date']); ?>   <strong><?php echo $aff['Titre']; ?></strong><br />
		<p><em><?php echo $aff['Texte']; ?></em></p><br />
	</div>
	<?php }
	mysql_close() ;
?>

L'image qui pose problème est entourée avec des * pour que vous la reconnaissiez.
Je vous ajoute un petit bout de CSS correpondant :
.post {
	width : 860px ;
	margin : 20px 10px ;
	height : auto ;
	background-image : url("bordure-basse.png") ;
	background-position : left bottom ;
	background-repeat : no-repeat ;
	padding-bottom : 20px ;
	padding-left : 20px ;
	padding-right : 10px ;
}
.post .accompagnement {
	float : right ;
}

Merci d'avance pour vos éventuelles réponses.
Arpheus
Lire la suite 

News en php avec image flottante »

1 réponses
Réponse
+0
moins plus
J'ai fini par trouver une méthode visiblement controversée car un peu bidouille, mais qui au moins fonctionne : spacer.
Si quelqu'un cherche la même chose que moi, je la décrit :

à la fin du contenu du cadre, mettre un
<div class="spacer"> </div>
, le div contenant un espace insécable.
Dans les propriétés CSS, un
.spacer {
      clear : both ;
}

finit le travail, et permet d'ajuster son cadre à l'image en float.
Voilou
Ajouter un commentaire
Ce document intitulé « news en php avec image flottante » issu de CommentCaMarche (www.commentcamarche.net) est mis à disposition sous les termes de la licence Creative Commons. Vous pouvez copier, modifier des copies de cette page, dans les conditions fixées par la licence, tant que cette note apparaît clairement.
Dossier à la une
Passage au tout numérique : quel coût pour les particuliers ?