Aligner texte et image sur site web

Résolu/Fermé
46.Divers Messages postés 48 Date d'inscription samedi 5 novembre 2011 Statut Membre Dernière intervention 5 avril 2013 - Modifié par 46.Divers le 26/02/2013 à 21:19
albert733 Messages postés 267 Date d'inscription samedi 8 décembre 2012 Statut Membre Dernière intervention 28 octobre 2014 - 27 févr. 2013 à 18:12
Bonjour,
depuis plusieurs heures je cherche comment je pourrais aligner un texte à droite d'une image. Je voudrais également que le texte soit centrer par rapport à l'image. J'aimerais que vous m'aidiez afin de respecter le HTML5 et le CSS3

voici un exemple de ce que je veux faire en image :
https://www.casimages.com/i/130226085315622587.gif.html

Voici ce que j'ai écrit :

<section>
<figure>
<a href="etiquette2008.gif">
<img src="2008.gif" alt="2008" id="2008" title="Cliquez pour agrandir" />
</a>
</figure>

<p>
Texte... <br/>
Texte... <br/>
Texte...
</p>
</section>

merci de m'aider


A voir également:

3 réponses

albert733 Messages postés 267 Date d'inscription samedi 8 décembre 2012 Statut Membre Dernière intervention 28 octobre 2014 11
26 févr. 2013 à 21:48
bonjour,
il faut d'abord que tu crées des blocs appelés <div id="le nom ici">
tu en crées un bloc pour ton texte et ton image
ensuite tu en crées un dedans pour ton image et un autre pour ton texte que tu positionnes ensuite dans ta feuille de style à ta guise ("le nom que tu a choisis" { le style })
n'oublies pas de le fermé la balise </div>
1
albert733 Messages postés 267 Date d'inscription samedi 8 décembre 2012 Statut Membre Dernière intervention 28 octobre 2014 11
26 févr. 2013 à 21:54
voila je t'ai fais un exemple:
<! DOCTYPE html>
<html>
	<head>
		<title>exemple pour le forum de comment ca marche</title>
		<link rel="stylesheet" type="text/css" href="style.css"></link>
	</head>
	
	<body> 
	<div id="page">
		<div id="menu">
		<ul id="niveau1">
			<li><a href="Titre 1.html">accueil</a>	</li>
			<li><a href="Titre 2.html"> xxx a></li>
			<li><a href="Titre 3.html"> yyy </a></li>
		</ul>
		</div>
		<div id="bloc_de_texte_et_image">
			<div id="image001">
			tu insères ici ton image
			</div>
			<div id="texte001">
			tu insères ici ton texte
			</div>
		</div>
	</div>
0
46.Divers Messages postés 48 Date d'inscription samedi 5 novembre 2011 Statut Membre Dernière intervention 5 avril 2013 32
26 févr. 2013 à 22:02
J'ai fait ceci le texte ce positionne toujours en dessous de mon image.
On ma dit également qu'il fallait mettre align="left"
Effectivement mon image est bien à gauche de mon texte comme je le souhaite mais mon image dépasse de ma section
0
albert733 Messages postés 267 Date d'inscription samedi 8 décembre 2012 Statut Membre Dernière intervention 28 octobre 2014 11
26 févr. 2013 à 22:04
essaye de redimensionner l'image.
0
46.Divers Messages postés 48 Date d'inscription samedi 5 novembre 2011 Statut Membre Dernière intervention 5 avril 2013 32
26 févr. 2013 à 22:36
En fait la taille de l'image me va très bien c'es juste qu'elle sort de l'encadrement sur la photo.
J'aimerais que la bouteille 2008 et le texte aligné avec soit encadré mais j'ai sa :
http://nsa29.casimages.com/img/2013/02/26/130226094826597624.gif
0
46.Divers Messages postés 48 Date d'inscription samedi 5 novembre 2011 Statut Membre Dernière intervention 5 avril 2013 32
26 févr. 2013 à 22:53
J'ai sa:
http://nsa30.casimages.com/img/2013/02/26/130226105208914043.gif

Alors que je veux sa :
http://nsa29.casimages.com/img/2013/02/26/130226105405795929.gif
0
albert733 Messages postés 267 Date d'inscription samedi 8 décembre 2012 Statut Membre Dernière intervention 28 octobre 2014 11
27 févr. 2013 à 10:04
en fait c'est un problème de taille de bloc je pense
il faut que tu redimensionnes la taille du bloc
0
46.Divers Messages postés 48 Date d'inscription samedi 5 novembre 2011 Statut Membre Dernière intervention 5 avril 2013 32
27 févr. 2013 à 11:44
Merci de ton aide j'ai réussi à résoudre ce problème, une autre personne m'a aidé la résolution est ici :
https://forums.commentcamarche.net/forum/affich-27234598-aligner-texte-et-image#p27236597
0