---
title: "Formular macht kein Umbruch"
url: "https://www.typo3.net/d/68035-formular-macht-kein-umbruch"
source: "typo3.net"
tags: ["Allgemein","Frage","HTML & CSS"]
created: "2007-09-12"
last_reply: "2007-09-15"
replies: 5
solved: false
page: 1
pages: 1
lang: "de"
---

# Formular macht kein Umbruch

Allgemein · 5 Antworten · gestartet 2007-09-12

## Eröffnungsbeitrag

**typo3_hp** · 2007-09-12 · [Beitrag #1](https://www.typo3.net/d/68035-formular-macht-kein-umbruch/1)

Hallo ich habe ein Formular auf <http://develop.cgsolutions-online.de/Kontaktformular.24.0.html>
und ich möchte das das Formular bündig untereinander steht. Es war auch einmal so, ich weiß nicht wieso es jetzt nicht mehr bündig ist...

Also so:

Name:
INPUT-FELD für Name

Vorname:
INPUT-FELD für Vorname
...

Hier mein TS:

Das CSS Mailstyle für das Formular wird im oberen Bereich meines TS eingelesen.

```typoscript
page.includeCSS {
file1 = fileadmin/templates/horizontal_CSS.css
file2 = fileadmin/templates/mailstyle.css
                }
```

Danach kommt das TS für die Konfig:

```typoscript
#Mailform
tt_content.mailform.20 {
accessibility = 1
noWrapAttr=1
formName = mailform
dontMd5FieldNames = 1
REQ = 1
layout =<div>###LABEL### ###FIELD###</div>
COMMENT.layout =<div>###LABEL###</div>

### doppeltes LABEL
// RADIO.layout =<div>###LABEL### ###FIELD###</div>
RADIO.layout =<div class="radiolayout">###FIELD###</div>

LABEL.layout =<div>###LABEL### ###FIELD###</div>

### Möglichkeit die Input Felder nebeneinander sauber
### darzustellen
//labelWrap.wrap =<div style="width:100px; float:right;">|</div>
labelWrap.wrap =<div style="width:350px;">|</div>

commentWrap.wrap = |

### nach jeden Optionsfeld ein Umbruch, lässt man den weg, sind
### die Optionsfelder nacheinander
radioWrap.wrap = |<br />

### Das selbe gilt für benötigte Felder in Formularen
#REQ.labelWrap.wrap =<div style="width:100px; #float:right;">|</div>
REQ.labelWrap.wrap =<div style="width:350px;>|</div>
stdWrap.wrap =<div class="formu">|</div>
}



### Des weiteren habe ich für die einzelnen durch CSS definierten
### Input, Select, etc. Klassen, ebenfalls im Setup von TYPO3

tt_content.mailform.20 {
params >
params.input = class="mf-input"
params.password = class="mf-pass"
params.textarea = class="mf-text"
params.check = class="mf-check"
params.radio = class="mf-radio"
params.select = class="mf-select"
params.file = class="mf-file"
params.reset = class="mf-reset"
params.submit = class="mf-submit"
}
```

Hat mir jemand eine Idee??

Danke und lg chris

## Antworten

### [#2](https://www.typo3.net/d/68035-formular-macht-kein-umbruch/2) · einpraegsam.​net · 2007-09-12

Schau mal ob dein CSS wirklich eingebunden wird ansonsten musst du wohl den Inhalt checken...

### [#3](https://www.typo3.net/d/68035-formular-macht-kein-umbruch/3) · typo3_hp · 2007-09-12

Das css stimmt und wird eingebunden. Habe auch testweise die Mailsytle.css von einem anderen Projekt genommen da habe ich das gleiche Problem, obwohl das Formular im anderen Projekt richtig angezeigt wird. EInen Unterschied im TS der 2 Projekte kann ich auch nicht sehen aber vll fällt ja euch was am TS bei meinem Mailform auf, denn daran muss es eigentlich liegen.

Weil das das CSS eingelesen wird seh ich ja auch schon an der farbigen Umrandund des Formulars.

Hat jemand eine Idee?
Vll habe ich auch irgendwo eine Klammer zu früh geschlossen??

Hier mal das ganze TS:

```typoscript
doctype = xhtml_trans
xhtml_cleaning = all


[browser = msie6]
config.doctypeSwitch = 1
[global]

page.includeCSS {
file1 = fileadmin/templates/horizontal_CSS.css
file2 = fileadmin/templates/mailstyle.css
                }

page {
headerData = COA
headerData.11 = TEXT
headerData.11.value = <script type="text/javascript" src="fileadmin/templates/horizontal_JS.js"></script>
}

Startkonfiguration Verbindung CSS/HTML/DBASE
page = PAGE
page.typeNum = 0
page.20 = TEMPLATE
page.20 {
template = FILE
template.file = fileadmin/templates/p1.html



subparts {
maincol < styles.content.get
}

#Hauptnavigation mit Java
subparts.menu = HMENU
subparts.menu {
	special = directory
	special.value = 2
	1 = TMENU
	1 {
		expAll = 1
		wrap = <ul id="nav">|</ul>
		noBlur = 1
		NO = 1
		NO.wrapItemAndSub = <li>|</li>

		IFSUB = 1
		IFSUB.wrapItemAndSub = <li class="menuparent">|</li>
		ACTIFSUB < .IFSUB
	}
	2 < .1	
	2.wrap = <ul>|</ul>
	3 < .2
	4 < .2
}


#Einbindung Navigation links
subparts.leftcol = HMENU
subparts.leftcol {
entryLevel = 1
special.value = 
1 = TMENU
1.NO.allWrap= <li class="NO"> | </li>
ACT = 1
wrap = <ul> | </ul>
ACT.allWrap = <li class="ACT"> | </li>
}

#Rootline
subparts.rootline=HMENU
subparts.rootline.special=rootline
subparts.rootline.special.range= -2 | -1 
subparts.rootline.1=TMENU
subparts.rootline.1.NO.allWrap= |   /   |*| |   /   |*| |

#Einbindung Copyright und Printlink
subparts.footer= TEXT
subparts.footer {
value =  &copy; Firma | <a href="http://url.de/Webdesign.22.0.html">Webdesign </a>  | <a href="http://url/Impressum.23.0.html">Impressum </a>
}


}


#Haupt CSS-Datei
page.stylesheet = fileadmin/templates/p1.css


###Im Plugin Erweiterte Suche wird die Indexierung von Dateien aktiviert ##
page.config.index_enable = 1
page.config.index_externals = 1
index_descrLgd = 50
notification_email_urlmode=all
config.index_enable = 1
config.index_externals = 1

# StaticDocuments
config.simulateStaticDocuments = 1
config.simulateStaticDocuments_pEnc = md5
config.simulateStaticDocuments_addTitle=22
config.simulateStaticDocuments_pEnc_onlyP = L

#Admin Panel einblenden
config.admPanel = 1

#SPAM Encrypt Protect
config.spamProtectEmailAddresses = 2
config.spamProtectEmailAddresses_atSubst = (at)

#Deutsche Datumformatierung in tt_news
plugin.tt_news.displayList.date_stdWrap.strftime = %A %e. %B
plugin.tt_news.displayLatest.date_stdWrap.strftime = %A %e. %B
plugin.tt_news.displaySingle.date_stdWrap.strftime = %A %e. %B
plugin.tt_news.displaySingle.time_stdWrap.strftime = %H:%M Uhr

config.stat = 1
config.stat_apache = 1
config.stat_apache_logfile = awstat.log
config.stat_mysql = 1

page.config.sys_language_uid = 1
page.config.language = de
page.config.locale_all = de_DE

#Mailform
tt_content.mailform.20 {
accessibility = 1
noWrapAttr=1
formName = mailform
dontMd5FieldNames = 1
REQ = 1
layout =<div>###LABEL### ###FIELD###</div>
COMMENT.layout =<div>###LABEL###</div>

### doppeltes LABEL
// RADIO.layout =<div>###LABEL### ###FIELD###</div>
RADIO.layout =<div class="radiolayout">###FIELD###</div>

LABEL.layout =<div>###LABEL### ###FIELD###</div>

### Möglichkeit die Input Felder nebeneinander sauber
### darzustellen
//labelWrap.wrap =<div style="width:100px; float:right;">|</div>
labelWrap.wrap =<div style="width:350px;">|</div>

commentWrap.wrap = |

### nach jeden Optionsfeld ein Umbruch, lässt man den weg, sind
### die Optionsfelder nacheinander
radioWrap.wrap = |<br />

### Das selbe gilt für benötigte Felder in Formularen
#REQ.labelWrap.wrap =<div style="width:100px; #float:right;">|</div>
REQ.labelWrap.wrap =<div style="width:350px;>|</div>
stdWrap.wrap =<div class="formu">|</div>
}



### Des weiteren habe ich für die einzelnen durch CSS definierten
### Input, Select, etc. Klassen, ebenfalls im Setup von TYPO3

tt_content.mailform.20 {
params >
params.input = class="mf-input"
params.password = class="mf-pass"
params.textarea = class="mf-text"
params.check = class="mf-check"
params.radio = class="mf-radio"
params.select = class="mf-select"
params.file = class="mf-file"
params.reset = class="mf-reset"
params.submit = class="mf-submit"
}
Feld wiederherstellen 	Constants: 	

#Pfad zum eigenen Template
plugin.tt_news.templateFile = fileadmin/templates/news_template.tmpl
# Variable pid_list wird leer gemacht
plugin.tt_news.pid_list >
# PID  wird über eine Konstante festgelegt
plugin.tt_news.pid_list = {$pid_list}
#Rekursiv, wenn euere News in Unterordner sind
plugin.tt_news.recursive >
plugin.tt_news.recursive = 1
#UID der Seite Singleview
plugin.tt_news.singlePid = {$singlePid}
#Archive Aktivieren
#UID der Archiveseite
plugin.tt_news {
  archive = 1
  archiveTypoLink.parameter = {$archiveTypoLink}
}
```

lg chris

### [#4](https://www.typo3.net/d/68035-formular-macht-kein-umbruch/4) · Unbekannter Benutzer · 2007-09-14

Also wenn du in deiner CSS-Class .formu nur die Width von einem Prozentwert auf einen festen Wert änderst, dann wird das schon so angezeigt wie du willst.

Du musst mal überlegen von welchem Wert aus denn 80% berechnet werden sollen... Da würde ich als Script auch auf dem Schlauch stehen...

Also z.B.:

```html
.formu {
width:200px;
padding-left:27px;
padding-top:25px;
padding-bottom:25px;
border: 0px solid #DEDDDB;
}
```

Setz dir am besten auch mal den Border auf 1px und spiel dann mal mit der width, dann siehst du auch was noch falsch ist. Alles nen bischen bug...

ich empfehle die Web-Developer Tools für den Firefox als Add On...

### [#5](https://www.typo3.net/d/68035-formular-macht-kein-umbruch/5) · typo3_hp · 2007-09-14

SUUPI!!

Vielen Dank

lg chris

### [#6](https://www.typo3.net/d/68035-formular-macht-kein-umbruch/6) · christian_s · 2007-09-15

Hallo

Ich benutze immer sehr gern die Extension TMmailform (pil_mailform). Damit kann man seine Formulare schön als HTML erstellen.

Gruss

Christian

---

Quelle: „Formular macht kein Umbruch“, typo3.net, https://www.typo3.net/d/68035-formular-macht-kein-umbruch
Beiträge von Mitgliedern des Forums. Bitte mit Link auf die Diskussion zitieren.