Zweispaltiges Formular

GoGo · 14. Juli 2014 19:51

Hallo alle zusammen!

Gibt es ein Template, dass ein Formular zweispaltig anzeigen läßt?

Schöne Grüße! smile

nockenfell · 14. Juli 2014 21:36

Was verstehst du unter 2 Spaltig?
3 Felder links und 3 Felder rechts?

GoGo · 14. Juli 2014 21:40

genau genommen vierspaltig. Hier Beispiel:

Erste Zeile
1. Spalte -> Vorname:
2. Spalte -> dazugehöriges Textfeld

3. Spalte -> Nachname:
4. Spalte -> dazugehöriges Textfeld

Nächste Zeile:
1. Spalte -> PLZ:
2. Spalte -> dazugehöriges Textfeld

3. Spalte -> Ort:
4. Spalte -> dazugehöriges Textfeld

usw......

nockenfell · 15. Juli 2014 06:40

Das könnte mit einer Float-Orgie durchaus gehen:

Hier klicken, um den Code zum Kopieren zu markieren

<div class="fields">
  <div class="container">
    <label>Vorname</label>
    <input />
  </div>
  <div class="container">
    <label>Nachname</label>
    <input />
  </div>
</div>

Hier klicken, um den Code zum Kopieren zu markieren

==== CSS ====
.fields {
  width: 500px;
}

.container {
  width: 240px;
  float: left;
}

label {

}

input {

}

Das ganze ist nur mal eine ungetestete Idee. So würde ich es probieren.

GoGo · 20. Juli 2014 11:48

Danke. smile
Ich werde es ausprobieren und berichten.

dietzi · 29. Januar 2015 09:10

Ich habe ein responsives Layout und will ein umfangreiches FB-Formular in 2 Spalten anzeigen lassen.
CMSms 1.11.11, FB 0.8

Hhmmm! Wie kann das funktionieren?

1) Die erzeugten Formularelemente im Quelltext statisch verwenden, wie kann dann die Validierung sichergestellt werden?

2) Im Formular-Template selbst das Layout vorgeben, für die Formularelemente eine zusätzliche Bedingung formulieren, wie class="ANZEIGE LINKS/RECHTS". Wie kann ich das definieren, als IF-Bedingung innerhalb von FOREACH, außerhalb oder direkt in FOREACH.

Freue mich auf Lösungsansätze.

Dietmar

Klenkes · 29. Januar 2015 09:57

Wenn du es in etwas so meinst, das ist einfach.
Formular
Die Spalte Kontaktdaten und Kontodaten sind jeweils in ein eigenes Fieldset mit einer CSS-Klasse gepackt.
Der Rest ist CSS! float:left; width: usw...

dietzi · 29. Januar 2015 11:10

Manchmal sieht man …, bekannter Spruch.

Danke für diesen watscheneinfachen Tip, damit bringe ich es wie gewünscht hin.

Dietmar

Andynium · 29. Januar 2015 11:45

Ergänzend und der Vollständigkeit halber - Rolf hat sich in seinem Blog auch intensiv mit dem FB Styling befasst wink

http://www1.cmscanbesimple.org/blog/for … stylesheet
http://www1.cmscanbesimple.org/blog/styling-forms
http://www1.cmscanbesimple.org/demo/for … r-template

Forum für CMS/made simple

#1 14. Juli 2014 19:51

Zweispaltiges Formular

#2 14. Juli 2014 21:36

Re: Zweispaltiges Formular

#3 14. Juli 2014 21:40

Re: Zweispaltiges Formular

#4 15. Juli 2014 06:40

Re: Zweispaltiges Formular

#5 20. Juli 2014 11:48

Re: Zweispaltiges Formular

#6 29. Januar 2015 09:10

Re: Zweispaltiges Formular

#7 29. Januar 2015 09:57

Re: Zweispaltiges Formular

#8 29. Januar 2015 11:10

Re: Zweispaltiges Formular

#9 29. Januar 2015 11:45

Re: Zweispaltiges Formular

Fußzeile des Forums