Afficher le nom d'une image sous l'image.

[moonwar]

Bonjour,

Avec le code qui suit, le script m'affiche 4 images (l'une à côté de l'autre sur la meme ligne, comme dans des <TD>) avec (au passage de la souris) le nom respectif de chaque image via un "alt".

/....suite du code
$albums = $mysql->select($sql);
if ($albums) {
	if (is_array($albums)) {
		for ($i = 0; $i < count($albums); $i++) {
			$thumb = GALERIE_PATH_1 . '/getimg.php?cat=' . $albums[$i]['image_chemin'];
			echo "\n" . '<span class="env3"><a href="' . '/photo/?alb=' . $albums[$i]['categorie_id'], '">';
			echo '<img border="0" title="' . htmlentities($albums[$i]['categorie_nom']) . '" src="' . $thumb
				. '" alt="' . htmlentities($albums[$i]['categorie_nom']) . '" />';
			echo '</a></span>';

		}
	} else {
		echo 'Aucun album disponible.';
	}
} else {
	echo 'erreur SQL :<br />' . mysql_error();
}

$mysql->fermer();

J'arrive à réccuperer le nom de chaque image avec un: echo ' ' . htmlentities($albums[$i]['categorie_nom']) . ' ';

Ma quéstion est : comment faire pour afficher le Nom de chaque image sous l'image elle meme, et cela sans perturber l'affichage?

Merci pour votre aide.

[iNCiTE Web]

Je serais tenter de rajouter ."<br />".htmlentities($albums[$i]['categorie_nom']) avant le "</a>", mais ça a l'air si simple que je me demande si j'ai compris la question

De plus un grand libellé pourrait aller sur plusieurs lignes et décaler...

[moonwar]

Merci pour ta réponse, mais c'est la première des choses à quoi j'ai pensé. Le <br /> met effectivement le texte sous l'image, mais affiche egalement l'image suivante... ce qui donne à la fin, toutes les images une audessous de l'autre. Moi je veux garder les images sur la meme ligne.

[iNCiTE Web]

Ben en fait tout dépend de la class "env3"

Tu as un exemple en ligne ?

[moonwar]

Pour l'exemple, envoila un lien

Je pense qu'avec une classe CSS en <TR> et <TD>, je vais pouvoir separer le code sans ouvrir deux fois la base de donnée, non??

[iNCiTE Web]

Holà tu mélanges un peu : soit c'est une mise en page en tableau (avec des TR TD etc), soit en CSS, mais les deux ne sont pas liés.

Le code que tu m'indiques n'est pas celui de ton exemple ?

Le mieux étant de mettre chaque image dans un DIV avec des dimensions précises, en flottant pour les avoir les uns à côté des autres.

<div style="float: left; width: 100px; height; 100px; margin: 5px">

<img src="/tonimage1" alt="" /><br />Ta légende

</div>

et tu continues en répétant le même code.

Regardes déjà si ça te convient, après tu mets le style dans une CSS, sous la forme #cadre pour copier une seule fois la mise en page.

[captain_torche]

Pourquoi mettre un div ?

Ici, tout me fait penser à une liste d'images. Il serait donc logique d'utiliser les balises appropriées, ul et li.

[iNCiTE Web]

Et bien le problème c'est qu'on ne sait pas vraiment... vu que je n'ai pas de lien

[moonwar]

Bonjour et Merci pour vos réponses,

<div style="float: left; width: 100px; height; 100px; margin: 5px">
<img src="/tonimage1" alt="" /><br />Ta légende
</div>

Je viens de tester cela et ca marche tres bien merci iNCiTE Web.

[iNCiTE Web]

De rien.

Mais comme le disait à juste titre Captain_torche, DIV pas l'élément conseillé si tu affiches une liste d'images...