Hallo,
ich habe vor ca. 4 Wochen mit Typo3 angefangen und habe ein Problem mit meinem Template.
Das Problem äussert sich wie folgt:
Wenn der Contentbereich in der mitte länger als das Menü links oder rechts ist, fehlt mir mein farbiger Hintergrund des jeweiligen Menüs links und rechts bis zum Footerbalken. Ich arbeite mit Div-Platzhaltern welche ich aus einer HTML Vorlage auslese. Wie kann ich es erreichen das der farbige Hintergrund der Menüs immer runter bis zum Footer angezeigt wird? Ich schaffe es nicht den DIV-Platzhalter dynamisch auf die gesamte Höhe zwischen Header und Footer anzupassen, Leider passt dieser die Höhe der Anzahl der Einträgen im Menü an. Siehe Bild. Ich komme da nicht mehr weiter und wäre sehr dankbar wenn mir jemand bei meinem Problem helfen könnte bzw. mit einen Tipp geben könnte.
Bild: pictureupload.de/…/310807122406_scpage.JPG
Meine CSS:
h2,h3,h4,h5,h6,div,html,body,p,input,button {
font: normal 12px Helvetica,Verdana,Arial
}
h1 {
font: normal 14px Helvetica,Verdana,Arial;
font-weight: bold;
}
img.block {
display:block;
}
div, img {
margin:0;
padding:0;
border:0;
}
div#container {
width:1002px;
margin-left:auto;
margin-right:auto;
border:1px solid silver;
background: url(../fileadmin/images/background.gif) center repeat-y;
}
div#top {
font: bold 10px Verdana,Arial;
clear:both;
background-color:#001463;
text-align:right;
color:#FFFFFF;
padding:5px;
padding-right:10px;
}
div#top a {
text-decoration: none;
color:white;
}
div#header { background-color:#00618E; }
/*-----------------------------------*/
div#left {
float:left;
width:180px;
padding-top:37px;
padding-bottom:10px;
background-color:#00618E;
}
div#head {
font: normal 10px Helvetica,Verdana,Arial;
padding-top:5px;
padding-bottom:5px;
}
div#center {
margin-left:190px;
width:620px;
}
div#right {
width:200px;
height:auto;
float:right;
text-align:left;
padding-top:10px;
background-color:#D3E2F9;
}
.float-left {
float:left;
}
div#footer {
clear:both;
background-color:#001463;
padding:10px;
}
TS vom Template:
page = PAGE
page {
# Allgemeine Seiteneigenschaften setzen
# page.bodyTag = <body>
# stylesheet = fileadmin/style.css
# Design Vorlage integrieren
10 = TEMPLATE
10.template = FILE
10.template.file = fileadmin/vorlage.html
10.workOnSubpart = DOKUMENT
10.marks {
# Platzhalter Datum ansprechen
DATUM = TEXT
DATUM.data = date : d.m.Y
# Platzhalter Logo ansprechen
LOGO = IMAGE
LOGO.file = fileadmin/images/logo.jpg
LOGO.file.width = 178
# Platzhalter Trailer ansprechen
TRAILER = IMAGE
TRAILER.file = GIFBUILDER
TRAILER.file {
XY = 770, 100
backColor = #00618E
}
# Obere Textmenü erstellen
MENU_OBEN = HMENU
MENU_OBEN {
special = directory
special.value = 12
1 = TMENU
1.NO = 1
1.NO.linkWrap = | | |*| | | |*| |
}
# Linkes Grafikmenü erstellen
MENU_LINKS = HMENU
MENU_LINKS {
special = directory
special.value = 13
entryLevel = 1
1 = GMENU
1.NO = 1
1.NO {
XY = 178, 24
backColor = #00618E
# Text auf den Menüpunkt rendern
10 = TEXT
10.text.field = title
10.fontColor = #FFFFFF
10.fontFile = fileadmin/fonts/verdana.ttf
10.fontSize = 12
# 10.niceText = 1
10.offset = 14, 16
# Weisse Linie erzeugen
20 = IMAGE
20.file = GIFBUILDER
20.file {
XY = 178, 1
backColor = #FFFFFF
}
20.offset = 0, 23
}
# Rollover Pics
1.RO < .1.NO
1.RO.backColor = #061467
# Zweite Ebene als Kopie der esrsten
2 < .1
2.NO {
backColor = #D3E2F9
10.fontColor = #061467
10.fontSize = 11
}
2.RO < .2.NO
2.RO.backColor = #C1D5F4
# Dritte Ebene
3 < .2
3.NO {
backColor = #83A7DC
10.fontColor = #FFFFFF
10.fontSize = 11
}
3.RO < .3.NO
3.RO.backColor = #432FFF
}
# Klickpfad
KLICKPFAD = COA
KLICKPFAD {
# Vorgeschalteter Text
10 = TEXT
10.value = Sie befinden sich hier:
#Klickpfad an Position 20 darstellen
20 = HMENU
20 {
special = rootline
special.range = 2|-1
1 = TMENU
1.NO = 1
1.NO.linkWrap = | /
1.NO.stdWrap.parseFunc.short._ =
}
}
# Inhalt ausgeben
INHALT = CONTENT
INHALT {
table = tt_content
select.orderBy = sorting
select.where = colPos = 0
}
}
}
# Fehler JavaScript RealUrl
# page.headerData.15 >
page.bodyTag = <body>
page.stylesheet = fileadmin/CSS/style.css
page.10.marks.INHALT = CONTENT
page.10.marks.INHALT.table = tt_content
page.10.marks.INHALT.select.orderBy = sorting
page.10.marks.INHALT.select.where = colPos = 0
page.10.marks.WERBUNG = CONTENT
page.10.marks.WERBUNG.table = tt_content
page.10.marks.WERBUNG.select.orderBy = sorting
page.10.marks.WERBUNG.select.where = colPos = 1
page.10.marks.RECHTS = CONTENT
page.10.marks.RECHTS.table = tt_content
page.10.marks.RECHTS.select.orderBy = sorting
page.10.marks.RECHTS.select.where = colPos = 2
tt_content = CASE
😃 Nicht lachen....das ist mein erstes Template manche Sachen haben wie sie im Buch beschrieben waren, nicht funktioniert, daher habe ich manche Dinge dann händisch am Ende wie ich es für richtig hielt eingepflegt. :o
Bin für jeden Tipp Dankbar