0 votes
in SoSci Survey (dt.) by s100963 (230 points)

Wir würden gerne sieben Bilder als Antwortalternativen in zwei Zeilen präsentieren. Aktuell versuchen wir es mit dem Fragetyp "Auswahl" und nutzen sieben Kästchen. Diese werden bereits automatisch in zwei Zeilen präsentiert, allerdings rech chaotisch:

Gibt es eine Möglichkeit, die Position der einzelnen Auswahlfelder zu verändern, z. B. über {position: relative; left: 100px} bei den jeweiligen Antwortoptionen? Die Kreise sollen zunehmend überlappend präsentiert werden.

Eine andere Möglichkeit wäre, den Fragentyp "Horizontale Auswahl" in zwei Zeilen zu nutzen, also für die Kodierung in irgendeiner Form zu kombinieren. Schließlich könnte man noch mit SVG arbeiten, aber hier habe ich bisher keinerlei Erfahrungen.

Vielen herzlichen Dank für Ihre Antwort!

1 Answer

0 votes
by SoSci Survey (323k points)
selected by s100963
 
Best answer

Ich würde empfehlen, dass Sie die Bilder als erstes ein wenig in der Breite beschneiden und den Hintergrund, der aktuell weiß ist, auf transparent ändern. Vor allem das mit der Breite sollte die Überschneidungen in der erste Zeile beheben.

Für die zweite Zeile muss ich mir die Ausgabe nochmal genauer ansehen. Vermutlich reichen ein paar CSS-Ergänzungen, damit es die Bilder in der zweiten Zeile korrekt positioniert. Hätten Sie vielleicht einen Pretest-Link, der direkt zur betroffenen Seite führt?

by s100963 (230 points)
Danke für die schnelle Antwort!
Leider sind die Kreise momentan auch noch nicht in der eigentlich eingegebenen Reihenfolge. Das zweite Item befindet sich etwa unten links, das dritte oben an zweiter Stelle von links.
Hier der Pretest-Link:
https://geronto.fau.de/sosci/agingasfuture-t4/?act=dKWBk6zyhrVpt72zGSeWPGRj
by SoSci Survey (323k points)
Ah :) Danke für den Link. Stellen Sie in der Frage unter "Auswahloptionen" bei "Anordnung" doch bitte einmal "zeilenweise" statt "spaltenweise" ein.
by s100963 (230 points)
Viel besser :)
Wenn man jetzt noch die Breite der unteren Kästchen an die der oberen angleichen könnte, wäre es optimal.
by SoSci Survey (323k points)
Ergänzen Sie dafür folgende Zeile auf der Fragebogen-Seite:

pageCSS('
  .s2iSelection.dynamic div.place { flex-grow: 0; }
  .s2iSelection.dynamic.rows { justify-content: flex-start; }
');

Falls Ihr Server noch kein pageCSS() kennen sollte, können Sie den Inhalt (also die mittleren beiden Zeilen) auch in das <style>-Tag Ihres Fragebogen-Layouts schreiben.

Willkommen im Online-Support von SoSci Survey.

Hier bekommen Sie schnelle und fundierte Antworten von anderen Projektleitern und direkt von SoSci Survey.

→ Eine Frage stellen


Welcome to the SoSci Survey online support.

Simply ask a question to quickly get answers from other professionals, and directly from SoSci Survey.

→ Ask a Question

...