Forum d'entraide PHPFrance

Bonjour,

J'ai fais un code, en fin de compte je recois un espace enorme entre la ligne 1 et 4, comment eviter cet espace??

voici le resultat

<html dir="ltr">
<head>
    <script type="text/javascript" src="http://ajax.googleapis.com/
ajax/libs/jquery/1.5/jquery.min.js"></script>
<script type="text/javascript" src="http://masonry.desandro.com/masonry.pkgd.min.js"/>
<script type="text/javascript" >
$(function()
{
// masonry plugin call
$('#container').masonry({itemSelector : '.item',});
});
</script>

<style>
 #container, #container2{
     width:800px; 
     margin: 0 auto; 
 }
.item {
width: 375px;
margin: 5px;
float: left;
background-color:#ffffff;
border:solid 1px #B4BBCD;
min-height:50px;
text-align:justify;
word-wrap:break-word;
}   
    
</style>
</head>


<div id="container">

<div class="item">
111111<br />
111111<br />
111111<br />
111111<br />
111111<br />
111111<br />
111111<br />

</div>
    
<div class="item">
222222222<br />
222222222<br />
222222222<br />
222222222<br />
222222222<br />
</div>
    
<div class="item">
333333333 <br />
333333333 <br />
333333333 <br />
333333333 <br />
</div>
    
<div class="item">
44444444<br />
44444444<br />
44444444<br />
44444444<br />
44444444<br />
</div>

<div class="item">
5555555555<br />
5555555555<br />
5555555555<br />
5555555555<br />
5555555555<br />
</div>    
    
<div class="item">
66666666666<br />
66666666666<br />
66666666666<br />
66666666666<br />
66666666666<br />
</div>      
</div> 
</html>

merci a vous

Ton problème est lié à la propriété float: left de ta classe css .item, essaye de diminuer le contenu du div contenant les "2", et je te conseille de revoir la propriété float.

Comme solution soit du utilise du js type http://salvattore.com/ soit tu change ta façon d'afficher tes conteneurs.

merci Yosh, je vais voir le code

Salut, en fait je pense que c'est l'inverse Yosh, il faut augmenter le contenu de 2 pour que 3 glisse sous 1 et que 4 prenne sa place sous 2...
Tu peux aussi imposer une hauteur fix a tout les item et ca devrait aller...
si non, tu crée 2 colonnes, gauche et droite et dans la gauche, tu met 1, 3, 5 et dans la droite tu met 2, 4, 6...

Salut, en fait je pense que c'est l'inverse Yosh, il faut augmenter le contenu de 2 pour que 3 glisse sous 1 et que 4 prenne sa place sous 2...
Tu peux aussi imposer une hauteur fix a tout les item et ca devrait aller...
si non, tu crée 2 colonnes, gauche et droite et dans la gauche, tu met 1, 3, 5 et dans la droite tu met 2, 4, 6...

Non, c'était simplement pour qu'il se rende compte du comportement "normal" de la propriéte float.

Autant pour moi !!!

j'ajoute que je recupere le contenu depuis une base de donnee

Forum d'entraide PHPFrance

Eviter l'espace entre les 2 lignes

Eviter l'espace entre les 2 lignes

Re: Eviter l'espace entre les 2 lignes

Re: Eviter l'espace entre les 2 lignes

Re: Eviter l'espace entre les 2 lignes

Re: Eviter l'espace entre les 2 lignes

Re: Eviter l'espace entre les 2 lignes

Re: Eviter l'espace entre les 2 lignes