Page 1 sur 1

Incapacité à afficher deux éléments HTML générés dynamiquemennt l'un à côté de l'autre.

Posté : 10 août 2020, 15:58
par Luffy1992
Bonjour.
Je cherche pour un projet PHP à afficher une série de plusieurs div et label l'un en face de l'autre suite à un changement de page.
En cherchant sur Internet, j'ai trouvé qu'il fallait utiliser la propriété CSS float:left pour réussir çà.

Mes éléments HTML sont générés dynamiquement dans un code PHP à partir de plusieurs echo comme ceci :

Code : Tout sélectionner

echo "<div class='floata'>"; echo "<label class='etiquette' class='box' for='patientsNIR'>"; echo "PatientsNIR"; echo "</label>"; echo "<div class='". $truc . "' name='patientsNIR'>" . $patientsNIR . "</div>"; echo "</div>"; echo "<br />"; echo "<div class='floata'>"; echo "<label class='etiquette' class='box' for='medecin'>"; echo "Medecin"; echo "</label>"; echo "<div class='". $truc . "' name='medecin'>" . $medecin . "</div>"; echo "</div>"; echo "<br />"; echo "<div class='floata'>"; echo "<label class='etiquette' class='box' for='typeEE'>"; echo "TypeEE"; echo "</label>"; echo "<div class='". $truc . "' name='typeEE'>" . $typeEE . "</div>"; echo "</div>"; echo "<br />"; echo "<div class='floata'>"; echo "<label class='etiquette' class='box' for='session'>"; echo "Session"; echo "</label>"; echo "<div class='". $truc . "' name='session'>" . $session . "</div>"; echo "</div>"; echo "<br />"; echo "<div class='floata'>"; echo "<label class='etiquette' class='box' for='dateEE'>"; echo "DateEE"; echo "</label>"; echo "<div class='". $truc . "' name='dateEE'>" . $dateEE . "</div>"; echo "</div>"; echo "<br />"; echo "<div class='floata'>"; echo "<label class='etiquette' class='box' for='age'>"; echo "Age"; echo "</label>"; echo "<div class='". $truc . "' name='age'>" . $age . "</div>"; echo "</div>"; echo "<br />"; echo "<br />"; echo "<div class='floata'>"; echo "<label class='etiquette' class='box' for='idEE'>"; echo "IdEE"; echo "</label>"; echo "<div class='". $truc . "' name='idEE'>" . $idEE . "</div>"; echo "</div>"; echo "<br />"; echo "<br />"; echo "<div class='floata'>"; echo "<label class='etiquette' class='box' for='tailleCM'>"; echo "TailleCM"; echo "</label>"; echo "<div class='". $truc . "' name='tailleCM'>" . $tailleCM . "</div>"; echo "</div>"; echo "<br />"; echo "<div class='floata'>"; echo "<label class='etiquette' class='box' for='poidsKG'>"; echo "PoidsKG"; echo "</label>"; echo "<div class='". $truc . "' name='poidsKG'>" . $poidsKG . "</div>"; echo "</div>"; echo "<br />"; echo "<div class='floata'>"; echo "<label class='etiquette' class='box' for='bmi'>"; echo "BMI"; echo "</label>"; echo "<div class='". $truc . "' name='bmi'>" . $bmi . "</div>"; echo "</div>";
La classe floata contient bien la propriété css :

.floata {

float:left;

}

et j'ai entouré les deux éléments avec un <div class="floata></div>.
Pourtant, à la fin, mon label et le div qui le suit sont affichés l'un en dessous de l'autre et non à côté.
J'ai essayé de mettre la propriété float:left dans une classe reliée à label et une autre fois dans une classe reliée au div,
mais çà ne semble pas fonctionner.

Je ne comprends pas comment utiliser cette propriété.

Si quelqu'un pouvait m'indiquer si j'ai oublié quelque-chose dans mon css ou dans mes echo PHP,
je vous remercie d'avance.

Re: Incapacité à afficher deux éléments HTML générés dynamiquemennt l'un à côté de l'autre.

Posté : 10 août 2020, 20:10
par @rthur
Bonjour,

Ce n'est donc pas un problème de PHP mais de pur HTML, donc il faut déjà que tu réussisses à faire fonctionner un exemple simple de HTML de ce que tu veux faire pour bien comprendre le fonctionnement.
Et une fois que ce dernier aura été validé sur un exemple simple, tu peux commencer à le générer avec du PHP.

La doc de Mozilla est plutôt bien faite :
https://developer.mozilla.org/fr/docs/Web/CSS/float

Et voici un exemple fonctionnel que je viens de faire :
https://jsfiddle.net/xkpywfLb/

A toi de regarder le code HTML de ton appli et à repartir sur qqch de simple pour comprendre d'où vient le bug :-D