Zum Inhalt springen

content in meheren spalten anzeigen

Erstellt am 8. März 2007 · 3 Antworten · letzte Antwort am 10. März 2007

Tags: Templates & Layouts, HTML & CSS, Frage

via ·

Hallo,

kann mir jemand weiterhelfen wie ich folgenden Aufbau hinbekomme? Ich wollte dieses Beispiel dazu nutzen, mich als Ersatz für einen Tabellenaufbau mit div's auseinander zu setzen.

Bild: web3.s4.typo3server.com/…/aufbau.jpg

Ich würde das gerne mit divs machen. Ausserdem hatte ich überlegt, dass es ganz praktisch wäre, wenn ich den jeweiligen Content für die jeweilige Box über das Content-Element HTML platzieren könnte.

Bspw.
im HTML Template gibt es den Marker und div
<div id="boxen">###Content<div>

Als HTML Content-Elemente möchte ich dann über das CMS die Boxen befüllen. So in etwa:
<div id="box1">Trainings Angebot1<div>
<div id="box2">Trainings Angebot2<div>
<div id="box3">Business Angebote<div>
<div id="box4">Service & Kontakt<div>
<div id="box5">News<div>
<div id="box6">Shop<div>

Kann mir hier jemand konkret weiterhelfen?

Viele Grüße,
Oliver

via ·

Hallo nochmal,

jetzt bin ich einen Schritt weiter - so hoffe ich. Aber vielleicht kann mir jemand weiterhelfen ob ich auf dem richtigen Weg bin.

http://web3.s4.typo3server.com/index.php?id=694

4 Spalten in der ersten Zeile und wiederum 4 in der zweiten Zeile
allerdings sollen die beiden zeilen bzw. boxen 1.0 und 1.1 von einander getrennt sein.
box1.0 | box2.0 | box3.0 | box4.0 |
------------------------------------
box1.1 | box2.1 | box3.1 | box4.1 |
------------------------------------

im Typoscript habe ich die Spalten wie folgt angelegt

CONTENT < styles.content.get 
CONTENT_LEFT < styles.content.getLeft
CONTENT_RIGHT < styles.content.getRight
CONTENT_BORDER < styles.content.getBorder

... und hier mein css

#box1 {
	position:absolute;
	top: 5px;
	left: 5px;
	background: #FA7C00;
	width: 300px;
	padding:0px;
	border: 1px solid black;
	font-family:arial;
}
#box2 {
	position:absolute;
	top: 5px;
	left: 310px;
	background: #FFFF00;
	width: 300px;
	padding:2px;
	border: 1px solid black;
	font-family:arial;
}
#box3 {
	position:absolute;
	top: 5px;
	left: 620;
	background: #00FF00;
	width: 300px;
	padding:2px;
	border: 1px solid black;
	font-family:arial;
}
#box4 {
	position:absolute;
	top: 5px;
	left: 930;
	background: #00FF00;
	width: 300px;
	padding:2px;
	border: 1px solid black;
	font-family:arial;
}

Im CMS habe ich die Inhalte wie folgt angelegt
Bild: web3.s4.typo3server.com/…/boxen.jpg

Kann mir nicht doch jemand weiterhelfen?
Vielen Dank und viele Grüße,
Oliver