Aligné verticalement deux div [Résolu]

[Zeuth]

Bonjour,

Voici mon soucis :

Sur un de mes site, j'affiche en page d'accueil 6 news, deux cote à cote sur 3 lignes



Tous se passe bien quand les articles font la meme hauteur.
Par contre quand ce n'est pas le cas, comme sur la page 2

Ca rend vraiment pas bien..

Comment pourrais je faire pour aligner mes divs verticalement ?

Je vous mets le code d'en ce moment :

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
55
56
57
58
59
60
<div id="main">
		<div id="ZoneArticle1">
			<?php $plxShow->plxMotor->plxRecord_arts->loop(); ?>
			 <div class="colLeft">
					<p class="date"><?php $plxShow->artDate('<span>#num_day</span><br />#num_month | #num_year(2)'); ?></p>
					<h2><?php $plxShow->artTitle(); ?></h2>
					<p><?php $plxShow->lang('WRITTEN_BY') ?> <?php $plxShow->artAuthor() ?> </p>
					<?php $plxShow->artChapo(); ?>
					<p class="info_bottom"> <?php eval($plxShow->callHook('MySocialButtons')) ?></span></p>
			 </div>
 
			<?php $plxShow->plxMotor->plxRecord_arts->loop(); ?>
			<div class="colRight">
					<p class="date"><?php $plxShow->artDate('<span>#num_day</span><br />#num_month | #num_year(2)'); ?></p>
					<h2><?php $plxShow->artTitle(); ?></h2>
					<p><?php $plxShow->lang('WRITTEN_BY') ?> <?php $plxShow->artAuthor() ?> </p>
					<?php $plxShow->artChapo(); ?>
					<p class="info_bottom"> <?php eval($plxShow->callHook('MySocialButtons')) ?></span></p>
			</div>
		</div>
		<div id="ZoneArticle2">
			<?php $plxShow->plxMotor->plxRecord_arts->loop(); ?>
			<div class="colLeft">
					<p class="date"><?php $plxShow->artDate('<span>#num_day</span><br />#num_month | #num_year(2)'); ?></p>
					<h2><?php $plxShow->artTitle(); ?></h2>
					<p><?php $plxShow->lang('WRITTEN_BY') ?> <?php $plxShow->artAuthor() ?> </p>
					<?php $plxShow->artChapo(); ?>
					<p class="info_bottom"> <?php eval($plxShow->callHook('MySocialButtons')) ?></span></p>
			</div>
 
			<?php $plxShow->plxMotor->plxRecord_arts->loop(); ?>
			<div class="colRight">
					<p class="date"><?php $plxShow->artDate('<span>#num_day</span><br />#num_month | #num_year(2)'); ?></p>
					<h2><?php $plxShow->artTitle(); ?></h2>
					<p><?php $plxShow->lang('WRITTEN_BY') ?> <?php $plxShow->artAuthor() ?> </p>
					<?php $plxShow->artChapo(); ?>
					<p class="info_bottom"> <?php eval($plxShow->callHook('MySocialButtons')) ?></span></p>
			</div>
		</div>
		<div id="ZoneArticle3">
			<?php $plxShow->plxMotor->plxRecord_arts->loop(); ?>
			<div class="colLeft">
					<p class="date"><?php $plxShow->artDate('<span>#num_day</span><br />#num_month | #num_year(2)'); ?></p>
					<h2><?php $plxShow->artTitle(); ?></h2>
					<p><?php $plxShow->lang('WRITTEN_BY') ?> <?php $plxShow->artAuthor() ?> </p>
					<?php $plxShow->artChapo(); ?>
					<p class="info_bottom"> <?php eval($plxShow->callHook('MySocialButtons')) ?></span></p>
			</div>
 
			<?php $plxShow->plxMotor->plxRecord_arts->loop(); ?>
			<div class="colRight">
					<p class="date"><?php $plxShow->artDate('<span>#num_day</span><br />#num_month | #num_year(2)'); ?></p>
					<h2><?php $plxShow->artTitle(); ?></h2>
					<p><?php $plxShow->lang('WRITTEN_BY') ?> <?php $plxShow->artAuthor() ?> </p>
					<?php $plxShow->artChapo(); ?>
					<p class="info_bottom"> <?php eval($plxShow->callHook('MySocialButtons')) ?></span></p>
			</div>
		</div>
 
</div>

Code :

1
2
3
4
5
6
7
8
9
10
11
12
.colLeft {
 
	float: left;
	width: 450px;
	margin: 0 22px 0px 0;
}
.colRight {
 
	float: right;
	width: 450px;
	margin: 0 22px 0px 0;
}

MErci d'avance,

Zeuth

[Emyleen]

Bonjour!

Essaye de rajouter une <div style="clear:both;"></div> entre chacune de tes zones article ou alors la propriété clear:both dans leur css, cela devrait permettre de les aligner

[Zeuth]

Eh ben merci.. ça fonctionne

J'me sens un peu con la :'(

Un énorme Merci Emyleen