Hallo zusammen,
ich nutze Joomla 3.9.5 und das Template Helix3 (3.0.2) und habe das Problem das sich das Kontaktformular nicht wirklich responsive verhält.
Die Eingabefelder skalieren nicht und "schieben" sich in der mobilen Version außerhalb der Seite und der Titel des ersten Feldes befindet sich am falschen Platz.
Denke der Screenshot zeigt es ganz gut. Mit Visforms habe ich das gleiche Problem.
Hat jemand eine Idee wie ich das verbessern kann? Vorab schonmal vielen Dank.
Gruß Benschi
Moin!
Erste Wahl bei Problemen wäre für mich zuerst die Verwendung der jeweiligen aktuellen Software.
So kann man ggf. das Problem lokal nachstellen.
War das immer schon so, oder hast du was verändert?
Kann den Fehler bestätigen. Auch in der normalen Ansicht so.
Protostar ist ok. Müsste man mal schauen.
Ggf. Joomshaper-Forum und/oder Github-Issues
mir wird weder eine aktuellere Joomla Version noch eine neuere Helix3 Version angeboten..
Dann weißt Du es jetzt uns solltest auf die aktuelle 3.10.5 updaten.
Hat er schon:
Nachdem ich manuell nach Updates gesucht habe, konnte ich auf Joomla 3.10.5 aktualisieren, aber leider besteht das Problem immer noch.
Kopier das ins Custom CSS - dann schaut's schon viel besser aus:
/* Behebt das Label Problem am Desktop */
.control-group {
clear: both;
}
/* Mobiloptimierung des Formulars */
@media (max-width: 767px) {
.form-horizontal .control-label {
float: none;
text-align: left;
width: 100%;
}
.form-horizontal .controls {
margin-left: 0;
}
.controls INPUT[type="checkbox"] {
width: 15px;
}
}Hallo,
ich frag mich, wo diese
<form id="contact-form" action="/mysg/index.php/kontakt" method="post"
class="form-validate form-horizontal well"><fieldset>
<legend>Eine E-Mail senden</legend>form-horizontal.well > Klasse kommt. Wenn ich diese temporär entferne, passt das Formular.
Liebe Grüße
Christine
Moin Christine,
inwiefern passt das Formular dann?
.well
fügt, wenn ich das richtig sehe, an Auswirkungen 20px padding um das Form herum hinzu - kommt so meine ich schon aus dem Core.
Wieso Helix3 mit dem Core Formular mobil überhaupt Probleme hat, ist mir schleierhaft. Aber solche paar-Zeilen-CSS Fixes habe ich über die Jahre am laufenden Band in diversen, eigentlich mobiloptimierten Templates, durchgeführt.
Gruß
Pascal
inwiefern passt das Formular dann?
.well
fügt, wenn ich das richtig sehe, an Auswirkungen 20px padding um das Form herum hinzu - kommt so meine ich schon aus dem Core.
Mache es bildlich, dass Du siehst, was ich meine. Ist-Stand:
Bei meiner temporären Entfernung (im Html Code) form-horizontal well bleibt die Klasse .well in der template.css, Zeile 2852 davon unberührt und das Formular ist mobil OK.
Liebe Grüße
Christine
Aaaah, jetzt ist's klar - da geht's mehr um .form-horizontal als um .well.
Wenn man .form-horizontal entfernt, hat man auch am Desktop die umgebrochene Darstellung (mit passender Mobilversion).
Dass die Labels dann am Desktop nicht mehr linksseitig vor den Inputs sind, ist jedoch auch nicht das gelbe vom Ei.
Die form-horizontal Klasse kommt so direkt, hardcoded, aus dem Core.
Mit dem CSS, was die Mobildarstellung passend macht, hätte man beides.
Man könnte es natürlich auch umgekehrt machen und mit override ohne .form-horizontal die Labels am Desktop per CSS wieder floaten lassen.
Alles ein bisschen verworren 
Eigentlich müsste Helix3 com_contact (form) overrides mitbringen - tut es aber nicht.
