I'm creating form with choosing buttons:
But when I checked some options all the headings are going up and down:
PHP:
echo '<div class="flex-container flex-response" id="responseform" title="Kliknij, żeby skopiować" onclick="copyDivToClipboard()"><br><div>' .$gdziezamost. '' .$jakgniec. '' .$cowys. '' .$czynnt. '' . $czyncuk. '' .$czynik. '' .$czynmiaz. '' .$czynwien. '' . $czynhiper. '' .$czynotylo. '<p>OZW</p>' .$gdzielewo. '' . $gdzieprawo. '' .$jakkluc. '' .$jakpiecz. '' .$coodych. '' .$cotol. '' .$copalp. '' .$czynnt. '' .$czyncuk. '' . $czynik. '' .$czynmiaz. '' .$czynwien. '' .$czynhiper. '' . $czynotylo.'</div><br><br><div>' .$pojstopdo. '' .$pojstopup. '<p>ZMS</p>' .$pojnagle. '</div><br><br><div>' .$pojnagle. '' .$mocsil. '<p>Rozwarstwienie aorty</p>' . $pojstopdo. '' .$pojstopup. '' .$mocniew. '' .$mocsamo. '</div><br><br><div>' . $gdzielewo. '' .$gdzieprawo. '' .$jakkluc. '' .$jakpiecz. '' . $coodych. '' .$cotol. '' .$copalp. '' .$pojnagle. '' .$obduszn . '' .$paraspo. '' .$osluchscisz. '<p>Odma opłucnowa</p>' . $gdziezamost. '' .$jakgniec. '' .$cowys. '' .$mocsamo. '' . $paranorm. '</div> <br><br><div>' .$pojnagle.'<p>Preforacja przełyku</p>' .$pojstopdo . '' .$pojstopup. '' .$mocsamo. '</div><br><br><div><p>Ostry stan w jamie brzusznej</p></div><br><br><div>' .$gdzielewo. '' .$gdzieprawo. '' .$jakkluc. '' .$jakpiecz . '' .$coodych. '' .$cotol. '' .$copalp . '<p>Powikładne zapalenie płuc</p></div><br><br><div>' .$pojstopdo. '' .$pojstopup. '' .$czynprzezg. '' .$czynprzezp. '' .$czynunier. '' .$czynstanco. '<p>Zatorowość płucna</p>' .$gdziezamost. '' .$jakgniec. '' .$cowys. '' .$pojnagle. '' .$mocsamo. '</div></div>';}CSS/HTML which i'm using for this project, generally I'm using, but I think it cause so many problems, and don't know what to do:
.flex-container{ display: flex; justify-content: space-around; flex-wrap: wrap; }<div class="flex-container-main" id="flex-klatka-second"><h2 class="h-klatka-second">Mężczyzna z bólem klatki piersiowej</h2><div class="flex-container"><h2>Gdzie boli?</h2><input type="checkbox" name="bol-lewo" id="bol_lewo" value="Lewostronny<br><br>"><label for="bol_lewo">Lewostronnie</label><input type="checkbox" name="bol-zamost" id="bol_zamost" value="Zamostkowy<br><br>"><label for="bol_zamost">Zamostkowo</label><input type="checkbox" name="bol-prawo" id="bol_prawo" value="Prawostronny<br><br>"><label for="bol_prawo">Prawostronnie</label><input type="checkbox" id="first_plus"><label for="first_plus">+</label><div style="display:none" id="bol-regular"><input type="checkbox" name="bol-zuch" id="bol_zuch" value="Promieniowanie do żuchwy<br><br>"><label for="bol_zuch">Promieniowanie do żuchwy</label><input type="checkbox" name="bol-lopatk" id="bol_lopatk" value="Promieniowanie do łopatki<br><br>"><label for="bol_lopatk">Promieniowanie do łopatki</label><input type="checkbox" name="bol-gorny" id="bol_gorny" value="Promieniowanie do kończyny górnej<br><br>"><label for="bol_gorny">Promieniowanie do kończyny górnej</label></div></div><br><div class="flex-container"><h2>Jaki boli?</h2><input type="checkbox" name="bol-gniec" id="bol_gniec" value="Ucisk/gniecenie<br><br>"><label for="bol_gniec">Ucisk/gniecenie</label><input type="checkbox" name="bol-kluc" id="bol_kluc" value="Kłucie<br><br>"><label for="bol_kluc">Kłucie</label><input type="checkbox" name="bol-piecz" id="bol_piecz" value="Pieczenie<br><br>"><label for="bol_piecz">Pieczenie</label><input type="checkbox" id="second_plus"><label for="second_plus">+</label><div style="display:none" id="bol-jak"><input type="checkbox" name="bol-dusz" id="bol_dusz" value="Duszenie<br><br>"><label for="bol_dusz">Duszenie</label><input type="checkbox" name="bol-trudno" id="bol_trudno" value="Trudno określić<br><br>"><label for="bol_trudno">Trudno określić</label><input type="checkbox" name="bol-rozr" id="bol_rozr" value="Rozrywanie<br><br>"><label for="bol_rozr">Rozrywanie</label></div>How can i make that variables not changing position of headings?