Abend Leute,
ich habe mir mal den Thread zum stylen von Formularen durchgelesen aber die Lösung für mein Problem nicht gefunden.
Es geht um Folgendes. Ich habe ein normales Kontaktformular in Typo3 erstellt. Jetzt habe ich das Formular gestyled aber es wird nicht richtig dargestellt. Das Problem ist das die Labels gefloatet werden und sich dadurch die Felder verschieben bzw. die Begrenzung durch den umrahmenden div-Layer ignoriert wird.
Ich möchte nun aus dem div-Layer
<div class="csc-mailform-field">
den div-Layer
<div class="csc-mailform-field clearfix">
machen. Diese Klasse brauche ich um die durch das floaten verursachen darstellundgsfehler zu beheben. Ich hoffe ihr könnt mir helfen.
Gruß Andy
Was spricht gegen:
.csc-mailform-field {
clear: both;
}
danke dir, hät ich auch selbst dran denken können :-)
Würde mich aber trotzdem mal interessieren wie man von typo3 generierten quelltext über typo script beeinflussen kann.
MFG
Jhonny2010 schrieb
danke dir, hät ich auch selbst dran denken können :-)
Würde mich aber trotzdem mal interessieren wie man von typo3 generierten quelltext über typo script beeinflussen kann.
Schau dir mal das TypoScript von css_styled_content an...
tt_content.mailform.20 {
accessibility = 1
noWrapAttr=1
formName = mailform
REQ = 1
commentWrap.cObject=COA
commentWrap.cObject{
20=TEXT
20.value=field-{current:1}
20.insertData=1
}
layout(
<div class="csc-mailform-field ###COMMENT###">###LABEL### ###FIELD###</div>
)
}
erzeugt:
<div class="csc-mailform-field field-Strasse">
<label for="mailformStrasse">Straße:*</label>
<input id="mailformStrasse" type="text" value="" size="20" name="Strasse">
</div>
<div class="csc-mailform-field field-PLZ">
<label for="mailformPLZ">PLZ:*</label>
<input id="mailformPLZ" type="text" value="" size="20" name="PLZ">
</div>
Statt ###COMMENT#### kann auch clearfix oder x-beliebige Klasse vergeben werden.
Gleich noch eine Ergänzung:
Es Fehlt ja dann noch das Hinzufügen einer Klasse für label.
Folgende Zeile in tt_content.mailform.20 { } einfügen:
COMMENT.layout = <div class="csc-mailform-label ###COMMENT###">###LABEL###</div>
Frontend:
<div class="csc-mailform-label field-strongAnschriftstrong">
<div class="csc-mailform-field field-Strasse">
<div class="csc-mailform-field field-PLZ">