Größe des Auswahlfeldes bei Auswahl-Abfolge (unabhängig von der Anzahl der Optionen) verändern?

Question

Ich habe sowohl im Fragetext als auch als Antwortoptionen Grafiken.

Da es nur 4 Antwortoptionen sind und automatisch die ganze Breite bei der ganzen Darstellung genutzt wird, sind die Felder viel zu groß (bei mehr Optionen passt es optisch, aber es gibt eben nur die 4). Die Bilder selbst in den Feldern kann ich über HTML kleiner machen, aber dann bleiben die zu großen Felder drumherum.

Gibt es dafür eine elegante Lösung?

Answer 1

Sie schreiben leider nicht, um welchen Fragetyp es geht?!

Wenn Sie eine normale Auswahlfrage mit Darstellung "Kärtchen" verwenden, dann können Sie eine Breite für die Kärtchen definieren und angeben, dass diese Zeilenweise platziert werden sollen (ohne die Anzahl der Spalten explizit einzutragen). Dann sollten die Kärtchen immer dieselbe Größe haben.

Ebenfalls einen Blick wert sein könnte die Zoom-Auswahl.

Comments

Es ist eine Auswahl-Abfolge mit Kärtchen (mit Reaktionszeit) und die Optionen sollen spaltenweise dargeboten werden

---

Gut, da ist es ein wenig anders... Welche Breite sollen die Kärtchen denn haben?

---

Da müsste ich etwas rumprobieren, aber vermutlich 100-200 Pixel.

---

Bitte fügen Sie im Fragebogen-Layout -> HTML-Vorlage -> <style>-Bereich folgende Anweisungen ein:

table.selClickOptions { width: auto; }
td.selClickOption { width: 100px; }

Eventuell müssen Sie die Voransicht des Fragebogens nochmal mit F5 neu laden, damit der Browser sich das aktualisierte Layout vom Server holt.

---

Habe ich probiert, aber leider tut sich da nichts...die Anzeige ist weiter deutlich größer als 100 Pixel (auch als 200 (habe es direkt vor dem Abschluss des style-Bereichs </style> eingefügt) .

---

Haben Sie im Browser F5 gedrückt? Sie arbeiten auf www.soscisurvey.de, ja? Könnten Sie einen Pretest-Link direkt (!) zur betroffenen Seite im Fragebogen posten?

---

https://www.soscisurvey.de/MultipleIntelligenzen/?act=hcMfLm6G4xvr9Hkme2jAIA3X

---

Vorsicht: Beim "td..." ist hinten kein "s" an "SelClickOption":

td.selClickOption { width: 100px; }

---

Ich hatte es zuerst ohne "s" und dann rumprobiert, da es nicht ging.
Also es verändert sich weder mit noch ohne s.
Vielleicht übersehe ich irgendetwas ganz Offensichtliches..?

---

Sie haben am Ende des <style>-Bereichs die Klammern ein wenig durcheinander gebracht. Falsch:

@media print {
    div.s2t-outer { display: block }
    div.s2t-left { display: none }

table.selClickOptions { width: auto; }
td.selClickOption { width: 100px; }
</style>


Richtig:


@media print {
    div.s2t-outer { display: block }
    div.s2t-left { display: none }
}

table.selClickOptions { width: auto; }
td.selClickOption { width: 100px; }
</style>

Das @print muss abgeschlossen sein, sonst funktioniert Ihre Anpassung nur beim Ausdrucken...