Farbiges <div> direkt unter dem Fotschrittbalken mit width: 100%

Question

Gibt es eine Möglichkeit, direkt unter der blauen Leiste mit dem Fortschrittsbalken ohne Abstand eine große (mehrzeilige) andersfarbige Sektion (z. B. <division>) einzufügen, deren Hintergrund sich ebenfalls über die gesamte Fensterbreite erstreckt?
Darin sollte sich die große Überschrift für die Umfrage befinden, die dieselbe Einrückung wie der Body-Text haben sollte.

Falls ja, ließe sich auch die Schriftart und font-weight ändern?
Aktuell zeigen meine Änderungen leider keine Wirkung.

Fragebogen-Layout: sosci23

Answer 1

Für die horizontale Platzierung ist die Klasse s2i-inner zuständig.

Wenn Sie also unter dem Element

<div id="S2Progress">
...
</div>

Ihr eigenes Element definieren und darin ein

<div class="s2t-inner">Ihr Inhalt</div>

dann sollte die Position stimmen. Eventuelle Formatierungen können Sie in dem Element natürlich auch ergänzen. Wenn das nicht klappt, posten Sie gerne mal einen Pretest-Link.

Comments

Vielen Dank für den Lösungsvorschlag.
Die farbige Sektion soll nur auf einer Seite angezeigt werden und ist daher als HTML-Code und "Fragebogen zusammenstellen" hinzugefügt.

Das Problem scheint hierbei zu sein, dass dieser Code dann im "Body"-Teil gefangen ist und es somit nicht möglich ist, das Div über die gesamte Fensterbreite und direkt im Anschluss an den Fortschrittsbalken zu plazieren.

---

Sie könnten an der entsprechenden Stelle im Layout einen Platzhalter einfügen, z.B. %extra-header%, und diesen auf der ersten Seite im Fragebogen mittels replace() definieren. Ich bin allerdings nicht 100% sicher, ob das auf der letzten Fragebogen-Seite noch funktioniert, v.a. wenn diese dann erneut geladen wird.

Alternativ können sie eine Kopie des Layouts anlegen, und mittels option('layout', ...) auf der betroffenen Seite das andere Layout mit dem zusätzlichen HTML-Code verwenden.