Bonjour,

Je développe un site avec Wordpress et j'aimerais sur une page avoir plusieurs lignes et sur chaque ligne: une image avec son texte à droite. Mais je voudrais également que ce soit responsive: que le texte et le conteneur s'adapte à l'écran..

J'ai pensé faire comme suite:

Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<div class="serieContainer">
<div class="serieImg">
<img class="alignnone size-medium wp-image-353" src="ImagePath" width="300" height="200" />
</div>
<div class="serieDesc">
<p class="serieTitle"><strong>Neurosciences</strong></p>
Ma description plus ou moins longue

</div>
</div>
<div style="clear: both;"></div>
<div class="serieContainer">
<div class="serieImg">
<img class="alignnone size-medium wp-image-353" src="ImagePath" width="300" height="200" />
</div>
<div class="serieDesc">
<p class="serieTitle"><strong>Neurosciences</strong></p>
Ma description plus ou moins longue

</div>
</div>
</div>
</div>
avec la CSS suivante:
Code : Sélectionner tout - Visualiser dans une fenêtre à part
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
.serieContainer{
	position:relative;
	padding:20px;
}

.serieTitle{
	font-size:15px;
	font-weight: bold;
	text-align:right; 
	vertical-align:top;
}

.serieImg{
	align:center;
	vertical-align:top;
        float:left;
}

.serieDesc{
width:700px;
	border:0;
	background:#400A06;
	color:#fff;
	text-align:justify;
	align:right;
	padding-left:3ex;
	padding-right:3ex;
        float:right;
}
Mais du coup si je ne fixe pas de taille width à serieDesc la description sera en-dessous de mon image sur un grand écran…
Comment éviter cela?

Merci.