Layout, Text über den Items anpassen

Question

Hallo,
für meine Umfrage muss ich diesen Fragebogen (s.u.) möglichst genau nachbauen.

Das Grundprinzip ist mit combine kein Problem – vor ein Problem stellt mich die Beschriftung über den Items.

Momentan versuche ich im Fragetyp Skala den „Text über den Items“ anzupassen.
Ausgewählt ist die Option „Text über den Eingabefeldern“; damit der Text nicht zentriert wird (was ursprünglich der Fall war) verwende ich folgenden html-code:

<p align="left"> 0 keine Angst <br> 1 wenig Angst <br> 2 mittelstarke Angst <br> 3 starke Angst <br> </p>

Problem: Jetzt startet der Text nicht über der 0 sondern ist etwas nach links verschoben.

Ich habe versucht, das ganz mittels style entsprechend zu verschieben. Das hat allerdings nicht geklappt. Zudem bin ich mir unsicher, ob sich die Beschriftung an verschiedene Bildschirmgößen anpassen würde.

Gibt es zudem eine Möglichkeit, den Text über den Items nicht dick zu drucken?

(Ich habe auch schon versucht, den Text über den Items unabhängig von der Frage mittels einer Tabelle auf der Fragebogenseite zu platzieren: Problem: diese Tabelle passt sich natürlich nicht an die Bildschirmgröße an)

Ich freue mich über jede Hilfe!

Answer 1

Zunächst einmal ist zu bedenken, dass die 1:1-Nachbildung nicht unbedingt sinnvoll ist. Der BIldschirm wird anders wahrgenommen als ein Blatt Papier - und es ist auch nicht auszuschließen, dass die Original-Darstellung einfach ein Kompromiss ist, welchen die Autoren dereinst eingehen mussten. Ich empehle also erst einmal zu hinterfragen, ob die getrennte Beschriftung aller Optionen nicht die bessere Wahl sein könnte.

Wenn Sie sich für die (wenig intuitive) Nachbildung entscheiden, dann sind Sie mit dem "Text über den Items" schon auf einem guten Weg. Rücken Sie dann die Antwortoptionen aber näher zusammen (s. Original) und zentrieren Sie wie folgt:

<div style="width: 100px; margin: 0 auto 1em auto;">
  0 keine Angst<br>
  1 wenig Angst<br>
  2 mittelstarke Angst<br>
  3 starke Angst
</div>

Die 100px müssen an die Breite des Textes angepasst werden - einfach ein wenig probieren. Wenn es auf der anderen Seite tatsächlich über die Skala hinaus ragen soll, ergänzen Sie noch ein white-space: nowrap; im <div>-Element.

Wenn Sie anstatt der EIngabefelder dann lieber noch Zahl hätten, können Sie in der Skala die Darstellungsvariante "Kärtchen" wählen. Oder eine "Bildskala" verwenden, die Sie entsprechend gestalten.

Machbar ist das alles. Aber wie gesagt: Hinterfragen Sie bitte die Sinnhaftigkeit, bevor Sie blindlings ein mäßiges Original replizieren.

Comments

Vielen Dank für die schnelle Antwort! Ich weiß, dass das Design alles andere als optimal ist - ich werde auf jeden Fall noch einmal darüber nachdenken.

Trotzdem habe ich noch eine kurze Nachfrage, die mich generell interessiert: Gibt es eine Möglichkeit, den Text über den Items nicht dick zu drucken?

---

> Gibt es eine Möglichkeit, den Text über den Items nicht dick zu drucken?

Ob diese fett oder normal ist, wird im Layout definiert. Wenn Sie es generell ändern möchten, dann dort.

Wenn es nur um das einzelne Feld geht, dann ergänzen Sie im DIV einfach noch die Anweisung:

<div style="width: 100px; margin: 0 auto 1em auto; font-weight: normal;">