Mehrfachauswahl (Checkbox) mittig unter Bild platzieren

Question

Guten Tag,

ich arbeite mit SoSci Survey und habe eine Frage zur Darstellung einer Mehrfachauswahl.

Ich möchte in einer Frage folgendes Layout erreichen:

oben ein Bild (zentriert)

darunter eine einzelne Mehrfachauswahl-Option („Ja, war dabei“)

Checkbox und Text sollen als Einheit horizontal nebeneinander stehen und zentriert in der Mitte der Seite angezeigt werden

Aktuell wird die Checkbox trotz eigener HTML-Anpassungen immer linksbündig dargestellt.

Vielen Dank für Ihre Unterstützung.

Liebe Grüße

Answer 1

Es kommt ein wenig auf den Kontext an, aber im einfachsten Fall reicht es, wenn Sie die Mehrfachauswahl in eine schmale Box setzen. Das könnte etwa wie folgt aussehen: Vor der Frage fügen sie folgenden HTML-Code ein:

<div style="width: 25%; min-width: 200px; margin: 0 auto;">

und hinter der Frage dann

</div>

Es gibt noch andere Wege über ein wenig CSS, aber wenn ich Ihnen da noch mehr aufzeigen soll, würde ich Sie bitten, dass Sie einen Pretest-Link direkt (!) zur betroffenen Seite erstellen und hier posten, damit ich mit den Kontext ansehen kann.

Comments

Ah super, das hat mich tatsächlich schon einen Stück weiter gebracht. Vielen Dank! Ein Aspekt wäre noch offen und zwar soll das Kästchen der Mehrfachauswahl direkt unter "Ja war dabei" zentriert platziert werden.

Ich habe in der Frageneinstellung "rum probiert", aber bisher keine Lösung gefunden.

Lieben Dank und viele Grüße

---

Nachdem das "Ja, war dabei" als Beschriftung für das Auswahlfeld dienen soll, würde ich in Betracht ziehen, dass Sie den Text direkt als Option eintragen und nicht als Fragetext. Zusammen mit der dynamischen Darstellung (im Moment scheint die statische Darstellung ausgewählt zu sein) kann man dann noch an der Feineinstellung feilen.

Alterantiv - wenn Sie ohnehin das Bild noch manuell per HTML-Code platzieren - können Sie das Auswahlfeld auch einfach direkt in einen HTML-Code an gewünschter Stelle einbinden: https://www.soscisurvey.de/help/doku.php/de:create:inputs-single

---

Super! Hat wunderbar funktioniert! Vielen Dank für den Support!