Mit dem folgenden, angepassten CSS wird ab 640px Fensterbreite auf 1-spaltig umgeschaltet, was sonst erst bei 479px passiert. Die 640px können Sie nach Ihrem Geschmack anpassen.
- Klicken Sie im Menü Website auf "Einstellungen"
- Klicken Sie auf CSS
- Fügen Sie folgende Textzeilen (ohne Überschrift und ohne Zeilennummern – am besten über das Dokumente-Icon rechts oben im Quellcode-Kasten kopieren) in das Feld "CSS" ein und schließen Sie den Dialog dann mit Klick auf "OK"
<style>
@media(max-width:640px) {
.responsivelayout div.zpRow .zpColumn.c1, .responsivelayout .zpColumnItem.c1,
.responsivelayout .zp-form .c1, .responsivelayout .zpgrid .c1, .responsivelayout div.zpRow .zpColumn.c2,
.responsivelayout .zpColumnItem.c2, .responsivelayout .zp-form .c2,
.responsivelayout .zpgrid .c2, .responsivelayout div.zpRow .zpColumn.c3,
.responsivelayout .zpColumnItem.c3, .responsivelayout .zp-form .c3,
.responsivelayout .zpgrid .c3, .responsivelayout div.zpRow .zpColumn.c4,
.responsivelayout .zpColumnItem.c4, .responsivelayout .zp-form .c4,
.responsivelayout .zpgrid .c4, .responsivelayout div.zpRow .zpColumn.c5,
.responsivelayout .zpColumnItem.c5, .responsivelayout .zp-form .c5,
.responsivelayout .zpgrid .c5, .responsivelayout div.zpRow .zpColumn.c6,
.responsivelayout .zpColumnItem.c6, .responsivelayout .zp-form .c6,
.responsivelayout .zpgrid .c6, .responsivelayout div.zpRow .zpColumn.c7,
.responsivelayout .zpColumnItem.c7, .responsivelayout .zp-form .c7,
.responsivelayout .zpgrid .c7, .responsivelayout div.zpRow .zpColumn.c8,
.responsivelayout .zpColumnItem.c8, .responsivelayout .zp-form .c8,
.responsivelayout .zpgrid .c8, .responsivelayout div.zpRow .zpColumn.c9,
.responsivelayout .zpColumnItem.c9, .responsivelayout .zp-form .c9,
.responsivelayout .zpgrid .c9, .responsivelayout div.zpRow .zpColumn.c10,
.responsivelayout .zpColumnItem.c10, .responsivelayout .zp-form .c10,
.responsivelayout .zpgrid .c10, .responsivelayout div.zpRow .zpColumn.c11,
.responsivelayout .zpColumnItem.c11, .responsivelayout .zp-form .c11,
.responsivelayout .zpgrid .c11, .responsivelayout div.zpRow .zpColumn.c12,
.responsivelayout .zpColumnItem.c12, .responsivelayout .zp-form .c12,
.responsivelayout .zpgrid .c12 {
width: 100% !important
}
.responsivelayout .zp-form.zp-editable .resizablefield input, .responsivelayout .zp-form.zp-editable .resizablefield textarea {
max-width: none !important
}
.responsivelayout .zpSpacer {
clear: both
}
.responsivelayout .zpSpacer.hor {
display: none
}
}
</style>
Alles anzeigen
Anschließend müssen Sie evtl. Ihre Seiten neu erstellen (Erweitert > Erstellen > Alle Seiten erstellen) und ggf. veröffentlichen.