0 votes
in SoSci Survey (dt.) by s125410 (140 points)

Hallo liebes Team,

leider werden bei mir beim Polaritätenprofil alle Fragen auf dem Handy nicht schön angezeigt. Wie kriege ich das besser hin?
https://www.soscisurvey.de/BewertungProdukte/?act=uO3WqUbUEjaeARORQiENcPnm

Danke!

by SoSci Survey (312k points)
Können Sie freudlicherweise bitte einen Link posten, der direkt (!) zur betroffenen Seite im Fragebogen führt? Danke.
by s125410 (140 points)
https://www.soscisurvey.de/BewertungProdukte/?act=1JP7uejGmRN54cuZA7qtw3dD

Das ist eine der betroffenen Seiten (bis S. 15). Muss ich alle betroffenen Seiten schicken?
 Danke!

1 Answer

+1 vote
by SoSci Survey (312k points)
selected by s125410
 
Best answer

Danke für den Pretest-Link. Bitte ergänzen Sie auf der Seite folgenden CSS bzw. PHP-Code:

pageCSS('
  #BW04_tab.s2items.slim div.s2input div.s2scale {
   max-width: 100%;
  }
  #BW04_tab div.s2series.numbering {
    width: auto;
  }
');

Wenn es noch weitere Seiten betrifft, fügen Sie den Code mit jeweils angepasster Frage-Kennung dort auch ein. Wir prüfen derweilen, was da schief läuft...

by s125410 (140 points)
Ich habe den Code nun auf der S.4 eingefügt, leider sehe ich keine Veränderung.
Ich habe auch extra eine Version für das Smartphone erstellt.
Es sieht genauso aus wie vorher.
by SoSci Survey (312k points)
> Ich habe auch extra eine Version für das Smartphone erstellt.

Tun Sie das bitte nicht. Das ist nur dann sinnvoll, wenn Sie Fragen auf dem Smartphone austaschen oder die Seiten anders anordnen möchten.

Aber ich sehe das Problem ... der Fragebogen bindet die CSS-Befehle in der falschen Reihenfolge ein. Ändert sich etwas, wenn Sie den PHP-Code ans Ende der Seite stellen?

Falls nicht, hilft der Vorschlaghammer des CSS: !important

pageCSS('
  #BW04_tab.s2items.slim div.s2input div.s2scale {
   max-width: 100% !important;
  }
  #BW04_tab div.s2series.numbering {
    width: auto !important;
  }
');
by s125410 (140 points)
Danke. Leider sind die beiden Pole "niedrige Qualität" "hohe Qualität" noch immer nicht ganz links und rechts. Die stehen beide über der 2 und der 5, was leider sehr missverständlich aussieht.
by SoSci Survey (312k points)
Das bekommen Sie mit folgender Ergänzung innerhalb des pageCSS() noch angepasst:

@media (max-width: 700px) {
  #BW04_tab.s2items.slim div.s2aboveLabels > div.s2polarLeft {
    text-align: left;
  }
  #BW04_tab.s2items.slim div.s2aboveLabels > div.s2polarRight {
    text-align: right;
  }
}
by s125410 (140 points)
Also, ich muss es so:
pageCSS('
(max-width: 700px) {
   #BW04_tab.s2items.slim div.s2aboveLabels > div.s2polarLeft {
     text-align: left;
   }
   #BW04_tab.s2items.slim div.s2aboveLabels > div.s2polarRight {
     text-align: right;
   }
 }

Einfügen? (das funktioniert nicht)

Oder zusätzlich unter das, was Sie vorher geschrieben haben?
so:
pageCSS('
   #BW04_tab.s2items.slim div.s2input div.s2scale {
    max-width: 100% !important;
   }
   #BW04_tab div.s2series.numbering {
     width: auto !important;
@media (max-width: 700px) {
   #BW04_tab.s2items.slim div.s2aboveLabels > div.s2polarLeft {
     text-align: left;
   }
   #BW04_tab.s2items.slim div.s2aboveLabels > div.s2polarRight {
     text-align: right;
   }
  ');
(da passiert nichts)
Tut mir leid, ich weiß leider nicht genau, wo ich das dann einfügen muss, damit es funktioniert.
Danke für die Hilfe!
by SoSci Survey (312k points)
Beides gemeinsam, aber bitte keine Klammern verlieren:

pageCSS('
  #BW04_tab.s2items.slim div.s2input div.s2scale {
   max-width: 100% !important;
  }
  #BW04_tab div.s2series.numbering {
    width: auto !important;
  }
  @media (max-width: 700px) {
    #BW04_tab.s2items.slim div.s2aboveLabels > div.s2polarLeft {
      text-align: left;
    }
    #BW04_tab.s2items.slim div.s2aboveLabels > div.s2polarRight {
      text-align: right;
    }
  }
');
by s125410 (140 points)
Super, vielen Dank!! Jetzt sieht es perfekt aus.
Und für die anderen Variablen muss ich jeweils nur das BW04 ändern, richtig?
by s125410 (140 points)
Für die nächste Seite (genauso eingefügt) sieht das leider wieder wie ganz am Anfang aus. Muss ich hier etwas beachten?
https://www.soscisurvey.de/BewertungProdukte/?act=ztcfXR9aBuFUqVK6eqQmSGFb

pageCSS('
   #BW05_tab.s2items.slim div.s2input div.s2scale {
    max-width: 100% !important;
   }
   #BW05_tab div.s2series.numbering {
     width: auto !important;
   }
   @media (max-width: 700px) {
     #BW05_tab.s2items.slim div.s2aboveLabels > div.s2polarLeft {
       text-align: left;
     }
     #BW05_tab.s2items.slim div.s2aboveLabels > div.s2polarRight {
       text-align: right;
     }
   }
 ');
by SoSci Survey (312k points)
Soweit ich erkennen kann (danke für den Link) ist die Kennung der Frge nicht BW05, sondern BW09. Wenn Sie ohnehin das !important verwenden, kann auch folgendes funktionieren (bitte mal testen):

pageCSS('
   .s2items.slim div.s2input div.s2scale {
    max-width: 100% !important;
   }
   div.s2series.numbering {
     width: auto !important;
   }
   @media (max-width: 700px) {
     .s2items.slim div.s2aboveLabels > div.s2polarLeft {
       text-align: left  !important;
     }
     .s2items.slim div.s2aboveLabels > div.s2polarRight {
       text-align: right  !important;
     }
   }
 ');

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

...