---
title: "csc-mailform-field -> css Klasse hinzufügen"
url: "https://www.typo3.net/d/102867-csc-mailform-field-css-klasse-hinzufuegen"
source: "typo3.net"
tags: ["Extensions","Frage","HTML & CSS"]
created: "2010-12-11"
last_reply: "2013-09-26"
replies: 5
solved: false
page: 1
pages: 1
lang: "de"
---

# csc-mailform-field -> css Klasse hinzufügen

Extensions · 5 Antworten · gestartet 2010-12-11

## Eröffnungsbeitrag

**Jhonny2010** · 2010-12-11 · [Beitrag #1](https://www.typo3.net/d/102867-csc-mailform-field-css-klasse-hinzufuegen/1)

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

```html
<div class="csc-mailform-field">
```

den div-Layer

```html
<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

## Antworten

### [#2](https://www.typo3.net/d/102867-csc-mailform-field-css-klasse-hinzufuegen/2) · einpraegsam.​net · 2010-12-12

Was spricht gegen:

```html
.csc-mailform-field {
   clear: both;
}
```

### [#3](https://www.typo3.net/d/102867-csc-mailform-field-css-klasse-hinzufuegen/3) · Jhonny2010 · 2010-12-12

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

### [#4](https://www.typo3.net/d/102867-csc-mailform-field-css-klasse-hinzufuegen/4) · einpraegsam.​net · 2010-12-13

> **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...

### [#5](https://www.typo3.net/d/102867-csc-mailform-field-css-klasse-hinzufuegen/5) · Neofine · 2013-09-26

```typoscript
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:

```typoscript
<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.

### [#6](https://www.typo3.net/d/102867-csc-mailform-field-css-klasse-hinzufuegen/6) · Neofine · 2013-09-26

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:

```typoscript
COMMENT.layout = <div class="csc-mailform-label ###COMMENT###">###LABEL###</div>
```

Frontend:

```html
<div class="csc-mailform-label field-strongAnschriftstrong">
<div class="csc-mailform-field field-Strasse">
<div class="csc-mailform-field field-PLZ">
```

---

Quelle: „csc-mailform-field -> css Klasse hinzufügen“, typo3.net, https://www.typo3.net/d/102867-csc-mailform-field-css-klasse-hinzufuegen
Beiträge von Mitgliedern des Forums. Bitte mit Link auf die Diskussion zitieren.