Affichage bloc avec balise <DIV>

**jfsyl** · 08/03/2021, 18h34

Bonjour à tous,

Je vous remercie d'avance pour votre aide.

Je ne parviens pas à aligner côte à côte des blocs <DIV> contenant des données lue dans une DB....

Mes blocs sont l'un en dessous de l'autre.....

Voici mon code CSS

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
.body{	
	margin:0;
	padding:0;}
 
#bloc{
	float:left;
	width:471px;
	height:313px;
        align-items: flex-start;
}
 
#twitchContent
{
     display: flex;
 
}
 
img {
  width: 150px;
  height: 100px;
}
 
.contain {
  object-fit: contain;
}

Voici mon fichier php

Code php :

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
31
32
33
34
<html>
    <link rel="stylesheet" href="cssdiv.css">
<?php
try
{
	$bdd = new PDO(';;charset=utf8','','',array(PDO::MYSQL_ATTR_INIT_COMMAND => 'SET NAMES utf8'));
}
catch (Exception $e)
{
	    // En cas d'erreur, on affiche un message et on arrête tout
        die('Erreur : ' . $e->getMessage());
}
 
// On récupère tout le contenu de la table Materiel
 
$reponse = $bdd->query('SELECT * FROM Materiel');	
 
?>       
    <body>
        <div id="twitchContent">
           <div id= "bloc">
 <?php while($row = $reponse->fetch(PDO::FETCH_ASSOC)) : ?> 
    <?php $rFile = 'images/'.$row['Code_article'].'.png'; ?>
    <?php $check = @fopen($rFile, 'r'); ?> 
    <?php if ($check): ?>
 <div><?php echo '<img class="contain" src="images/'.$row['Code_article'].'.png" onMouseOver="bigImg(this)" onMouseOut="normalImg(this)"/>';?></div>
 <div><?php echo htmlspecialchars($row['Denomination']); ?></div> 
 <div><?php echo htmlspecialchars($row['Benaming']); ?></div>    
 <?php endif; ?>
 <?php endwhile; ?> 
           </div>
        </div>    
    </body> 
</html>