Alignement texte avec image

Bonjour à tous,

Grâce à différent tuto j'ai compris (enfin) comment aligner du texte à droite de l'image.

Connaissez-vous une astuce pour que tout le texte ne s'aligne pas. En effet j'aimerai qu'à partir du titre "les 7 principes" , le texte soit en dessous de l'image ....

http://image.noelshack.com/minis/201...sans-titre.png

MErci d'avance

Ludovic

Tout dépend de comment tu as construit ta page.

Montre nous ton code.

Voici l'extrait de mon code html

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
<div id="contenu"> 
	<h3>L'Unité locale</h3><br />
 
	 <p class="flotte">
 <img src="images/delegation.png" alt="Image de notre nouvelle unité locale" />
</p>
 
<p>
Implantée dans le centre ville de Brest, 49 rue Barbès, l'unité locale est très active.
Forte de son engagement dans Brest et Brest métropole océane, l'unité locale met en place différentes actions sur l'ensemble de l'année.
Prévenir, aider, former, en respectant les 7 principes de la Croix-Rouge française sont nos maîtres mots.
Grâce à la centaine de bénévoles qui oeuvrent chaque année, nous pouvons poursuivre dans notre engagement, car "nous ne tolérons aucune souffrance". <br />
</p>
 
 
<h3>Les 7 principes</h3><br />
<p><b>Humanité :</b> Nous agissons au quotidien pour préserver ou rétablir la dignité de tout être humain.<br />
<b>Impartialité :</b> Nous ne jugeons pas et ne faisons aucune distinction. <br />
<b>Neutralité :</b> Nous ne prenons pas part aux hostilités ni aux controverses.<br />
<b>Indépendance :</b> Notre mouvement est indépendant. <br />
<b>Volontariat :</b> Nous sommes tous engagés volontaire. <br />
<b>Unité :</b> Il n'existe qu'une seule Croix-Rouge en France.  <br />
<b>Universalité :</b> Le Mouvement international de la Croix-Rouge et du Croissant-Rouge, au sein duquel toutes les sociétés ont des droits égaux et le devoir de s'entraider, est universel. </p><br />
<p> Pour plus d'informations sur les 7 principes fondamentaux consultez le site national en cliquant <a href="http://croix-rouge.fr" target="_blank">ICI </a>.
 
 
</div>

Et mon css :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
/* Différents bloc de la page */ 
body {
	margin:1% 10% 1% 10%;
	border-width:1px;
	border-style:solid;
	border-color:#939A99;
 
	}
 
img a:link , a:visited, a:hover , a:active {border : none;
}
a { text-decoration:none; }
a img{border: none;
}
img {
vertical-align:middle;}
 
div {
	text-align:left;
	}
 
div#bandeau {
	width:100%;
	height:auto;
		}
div#barremenu {
	width:100%;
	height:auto;
		}
div#menu {
	float:right;
	width:20%;
	height:auto;
	border-width:1px;
	border-style:solid;
	border-color:#939A99;
	}
div#contenu {
	float:left;
	width:79%;
	height:auto;
	}
div#pied_page {
	clear:both;
	width:100%;
	height:30px;
		}
.image {
	border:0px;
	}
.flotte {
float:left;
margin: 0 6px 6px 0;
}

Tu peux mettre une autre div dans ton id contenu qui se termine sous ton h3 les 7 principes et tu créés une autre div qui prend le reste :
Code:

1 2 3 4 5 6 7 8 9 10 11 12 <div id="centenu"> <div class ="premier"> <p class="float"> <img.... /> <h3>Les 7 principes</h3> </div> <div class="second"> <p>le reste du texte</p> </div> </div>