Webform - Text und Textfeld nebeneinander
Eingetragen von torfnase (1525)am 21.01.2010 - 13:13 Uhr in
Hallo zusammen,
ich habe mich ein bißchen mit dem Webform-Theming beschäftigt und wollte folgendes hinbekommen....
Die Feldbeschreibungen sollten im Formular neben den Feldern angeordnet sein, also etwa so
Name: [Textfeld für Name]
normalerweise ist es immer so
Name
[Textfeld für Name]
Beim Webform Theming bin ich dann natürlich auf die Möglichkeit gestoßen, so ein Kontaktformular zu gestalten, z.B. gesteuert über die Datei webform-form-[node-id].tpl.php
aber leider finde ich dort zwar die Möglichkeit, alles "drumherum" so zu gestalten, wie ich möcht, aber die einzelnen Felder werden nur durch die Zeile
print drupal_render($form['submitted']);
generiert....
Hat jemand einen Tipp, wie man Einfluss auf das Nebeneinander und Übereinander der Textfeldbeschreibung und des Textfeldes nehmen kann ?
- Anmelden oder Registrieren um Kommentare zu schreiben
Das ist alleine mit CSS
am 21.01.2010 - 13:29 Uhr
Das ist alleine mit CSS hinzubekommen! z.B Beispiel bei einer Webform (node 36)
form#webform-client-form-36 label {
display: inline-block;
width: 130px;
text-align: right;
margin-right: 10px;
}
form#webform-client-form-36 input {
display: inline-block;
text-align: left;
}
Es kommen dann unter Umständen noch ein paar weitere Justierungen hinzu.
Beste Grüße
Werner
Ich würde Label und
am 21.01.2010 - 14:04 Uhr
Ich würde Label und Input-Box mit
float: leftversehen. Zumal inline-block nicht von allen Browsern unterstützt wird.Super Tipp mit dem
am 21.01.2010 - 14:19 Uhr
Super Tipp mit dem Stylesheet - das werde ich nacher gleich einmal ausprobieren...
ich habe doch noch eine
am 22.01.2010 - 17:12 Uhr
ich habe doch noch eine Frage zum "Theming" des Moduls: Webform....
ich möchte das Stylesheet für label noch weiter unterscheiden
Beispiel:
Standardlabel wäre z.B. 130px breit
form#webform-client-form-2 label {display: inline-block;
text-align: right;
width:130px;
}
wenn es sich um das label PLZ handelt, dann möchte ich es schmaler machen....
die einzelnen Felder haben ja alle auch ID's
ist es möglich, das ich ein label#edit-submitted-plz (oder sowas) nochmals individuell anpassen kann ?
Aber klar! Je genauer Du die
am 22.01.2010 - 19:00 Uhr
Aber klar! Je genauer Du die Tags ansprichst, desto mehr ist die Wirkung eingeschränkt, bis hin zum einzelnen Tag. Sieh Dir die Source der Seite an oder noch besses, nimm Firefox mit dem Plugin Firebug, dann siehst Du sofort, welches Statement wirksam ist.
Beste Grüße
Werner
ich weiss, es ist eigentlich
am 22.01.2010 - 22:25 Uhr
ich weiss, es ist eigentlich gar keine richtig Drupal-Frage :-)
es ist für mich mehr ein css-Problem
z.B. sieht es im Quelltext so aus (eine Tabellen-Zeile mit dem Feld Nachname):
<tr><td colspan="4"><div class="webform-component-textfield" id="webform-component-name"><div class="form-item" id="edit-submitted-name-wrapper">
<label for="edit-submitted-name">Nachname: <span class="form-required" title="Dieses Feld wird benötigt.">*</span></label>
<input type="text" maxlength="40" name="submitted[name]" id="edit-submitted-name" size="40" value="" class="form-text required" />
<div class="description"><p> </p>
</div>
</div>
</div></td>
</tr>
ich weiß nicht, wie ich das spezielle Feld per css ansprechen bzw. das Style ändern kann....
Ich habe zwar auch den Firefox mit Firebug (kommt ja oft vor hier im Forum) aber ich weiß nicht so richtig, was man damit erkennen kann....
ich muß mich unbedingt mehr mit diesem CSS Kram beschäftigen :-)
Das gesamte Feld inclusive
am 22.01.2010 - 23:05 Uhr
Das gesamte Feld inclusive Label und Beschreibung kannst Du mit "div#edit-submitted-name-wrapper" im CSS ansprechen (z.B. für ein float: left;)
Das Label dieses Feldes sprichst Du an über "div#edit-submitted-name-wrapper label"
Es ist immer am einfachsten, wenn Du dich an eine ID hängen kannst, denn die darf auf der Seite nur einmal vorkommen. Ab da lassen sich Ketten bilden, die die Schachtelung der Tags beschreiben.
Besorge Dir mal ein gutes Buch über CSS, denn Wissen zu CSS ist unverzichtbar für Webseiten.
Beste Grüße
Werner
Es funktioniert
am 22.01.2010 - 23:21 Uhr
Es funktioniert prima...
Also du hast das so gut erklärt und ich denke, ich habe es auch verstanden, wie das zusammenhängt (jedenfalls so ein bißchen)...
also nochmals vielen Dank Werner :-)