Ask a Question

Footer mit Fester Höhe

0 votes
in SoSci Survey (dt.) by s217643 (110 points)

Hallo zusammen,

im Rahmen einer Studie an der Universität Würzburg, würden wir gerne im Fragebogen den Footer in einer festen Höhe einstellen für Smartphone Ansicht.

Unsere Idee war es den Body eine feste größe zu geben im HTML Code unter Frageboge-Layouts:

Dieser Code funktioniert leider nicht bei "HTML-Vorlage des Layouts".

Könntet Ihr mir bitte helfen, den Footer auf fester höhe für Smartphones einzustellen?

Damit wäre mir sehr geholfen.

Herzliche Grüße

1 Answer

0 votes
by SoSci Survey (306k points)

Welches Layout nutzen Sie denn?

Generell finden Sie im Layout einen Platzhalter %imprint% - den umliegenden Blockelementen (z.b. <div>) können Sie mit dem Attribut style="min-width: 80px"beispielsweise eine Mindesthöhe von 80 Pixeln geben.

by s217643 (110 points)
<body>
<div style="margin: 5px 0px">
    <div style="width: 40%; float: right"><!-- %progress% --></div>
    <div style="width: 50%">%logo%</div>
    <div style="min-height: 640px"</div>
    <hr style="clear: both; margin-bottom: 32px">
    %form.open%
    %questionnaire%
    %form.close%
    <hr style="clear: both; margin-top: 24px">
    %imprint%
</div>
</body>
by s217643 (110 points)
Wie haben das mit dem min-height so gemacht. Der footer verschiebt sich allerdings immer noch.
Gibt es einen Fix?

Besten Dank.
by SoSci Survey (306k points)
Ich kann nicht genau nachvollziehen, was sich verschiebt, aber das "min-height" hat in Ihrem Fall keine Wirkung auf den Footer. Dafür müsste es z.B. wir folgt aussehen:

  <hr style="clear: both; margin-top: 24px">
  <div style="min-height: 100px">
  %imprint%
  </div>
</div>
</body>
by s217643 (110 points)
Viele Dank für die schnelle Antwort.
Wir kriegen es leider mit dem Code nicht hin für unser Ziel.

Unser Ziel ist es, dass der Fragebogen eine feste Länge (height) hat und somit das Impressum immer an der gleichen Stelle angezeigt wird.

Momentan verschiebt sich das Impressum hoch und runter, je nachdem wie groß der Fragebogen ist.

Konnte ich es verständlich darstellen?
Besten Dank im voraus!
by SoSci Survey (306k points)
> Unser Ziel ist es, dass der Fragebogen eine feste Länge (height) hat und somit das Impressum immer an der gleichen Stelle angezeigt wird.

Dann habe ich Ihre Frage leider falsch verstanden. Eine fest Höhe macht angesichts stark variierender Bildschirmgrößen (inkl. Tablet und Smartphone) nur bedingt Sinn. Meist ist es geschickter, den Footer am unteren Bildschirmrand zu fixieren (so wie z.B. auf www.soscisurvey.de).

Aber um Ihre Frage zu beantworten. Für das beschriebene Ziel hatten Sie nur noch einen kleinen Fehler. Sie hatten geschrieben:

<div style="min-height: 640px"</div>

Korrekt wäre aber:

<div style="min-height: 640px">

und dazu passend vor dem </body> am Ende noch ein </div>
by s217643 (110 points)
Ich danke Ihnen sehr für die schnelle Hilfe und bitte um eine letzte Korrektur.

Unser Code sieht nun so aus.
Gerne würden wir das Impressum am Bildschirmende befestigen.

Können Sie uns bitte den Code nochmal Bugfixen.

Damit wäre uns sehr geholfen.

Herzliche Grüße,
Pham

<!DOCTYPE html>
<html>
<head>
%head%
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="target-densitydpi=high-dpi">
<meta name="viewport" content="width=320">
<meta name="viewport" content="width=device-width">
<style type="text/css">
body { width: %width-10%; min-height: 600px; margin: 0px auto; padding: 0px 5px; background-color: #FFFFFF }
table.question td.input { padding-top: 3px; padding-bottom: 3px }
div.prompt { width: 258px }

div.info div.symbol div.content,
div.warning div.symbol div.content { min-height: inherit; padding-left: 16px }
div.info div.symbol div.content:before,
div.warning div.symbol div.content:before { display: none }
</style>
</head>

<body>
<div style="margin: 5px 0px">
    <div style="width: 40%; float: right"><!-- %progress% --></div>
    <div style="width: 50%">%logo%</div>
    <div style="min-height: 640px">
    <hr style="clear: both; margin-bottom: 32px">
    %form.open%
    %questionnaire%
    %form.close%
    <hr style="clear: both; margin-top: 24px">
    %imprint%
</div>
</body>
</html>
by SoSci Survey (306k points)
> Gerne würden wir das Impressum am Bildschirmende befestigen.

Vermutlich müsste es so aussehen:

<div style="height: 120px;"></div>
<div style="position: fixed; bottom: 0; width: 100%; background-color: white"><hr>%imprint%</div>

Posten Sie gerne einen Pretest-Link zum Fragebogen, wenn das nicht auf Anhieb funktioniert.

> Können Sie uns bitte den Code nochmal Bugfixen.

Ich helfe gerne bei Fragen, aber die Umsetzung ist Ihr Job, wenn Sie das nicht als Dienstleistung zugekauft haben :)

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

Categories

Snow Theme by Q2A Market
Powered by Question2Answer
...