Zum Inhalt springen

Seitentyp Bild - Abstände formatieren

Erstellt am 16. April 2009 · 2 Antworten · letzte Antwort am 17. April 2009

Tags: Inhaltselemente, Bilder, Frage

Highco ·

Hallo an alle !!!

Habe ein Projekt mit 3 Frames (mit GoLive gemacht). Das soll ich jetzt mit Typo3 realisieren.

Linker Frame = Navi
Rechter Frame = Balken.
Mittlerer Frame = Inhalt.

Mit den Frames hat alles Super geklappt und die Navi funktionier prima.
Ich habe als Inhalt immer nur das element bild und dort 4 Spalten mit Bildern. Diese Bilder sind mit unterseiten verlinkt.

So, nun mein Problem. Die ursprüngliche Seite hat folgendes HTML für die Bilder-Formatierung.

</table>
			<table border="0" cellpadding="0" cellspacing="0" width="90%">
				<tr>
					<td valign="top" align="center" width="25%"><a href="kuenstler/Pia_Ampaw.html"><img src="pictures/Pia-Ampaw-02a.jpg" height="150" border="0" width="98" alt="" /></a></td>
					<td valign="top" align="center" width="25%"><a href="kuenstler/Lea_Dylewitz.html"><img src="pictures/Lea_Dylewitza.jpg" height="150" border="0" width="98" alt="" /></a></td>
					<td valign="top" align="center" width="25%"><a href="kuenstler/katrin_jaekel.html"><img src="pictures/katrin_jaekela.jpg" height="150" border="0" width="98" alt="" /></a></td>
					<td valign="top" align="center" width="25%"><a href="kuenstler/Gina_Baade.html"><img src="pictures/Gina-Baadea.jpg" height="150" border="0" width="98" alt="" /></a></td>
				</tr>
				<tr>
					<td valign="top" align="center" width="25%"><img src="elements/nul.gif" width="10" height="10" border="0" alt="" /></td>
					<td valign="top" align="center" width="25%"></td>
					<td valign="top" align="center" width="25%"></td>
					<td valign="top" align="center" width="25%"></td>
				</tr>
				<tr>
					<td valign="top" align="center" width="25%">
						<div align="center">
							<span class="bildunterschrift">Pia Ampaw</span></div>
					</td>
					<td valign="top" align="center" width="25%"><span class="bildunterschrift">Lea Dylewitz</span></td>
					<td valign="top" align="center" width="25%"><span class="bildunterschrift">Katinka Jaekel</span></td>
					<td valign="top" align="center" width="25%"><span class="bildunterschrift">Gina Baade</span></td>
				</tr>
			</table>

Wie kann ich die Bildabstände für das Inhaltselement "Bild" entsprechent anpassen. Entscheident ist hierbei das die abstände sich je nach Auflösung Prozentual verhalten.

Wo geh ich da denn ran ? CSS oder via TS. Habe schon so einiges Versuch und die Foren durchforstet aber nichts gescheites rausbekommen.

Wäre für jegliche Tips sehr dankbar.

Highco

Highco ·

Hallo nochmal,

So, ich hab jetzt mal ein bischen rumprobiert. Hab mir mal die Setup.txt von css_styles_content vorgenommen.

Dort kann ich schonmal die abstände vergrößern mit "margin".
Jedoch: Hab im Content-Element 4 Bilder nebeneinander (4 Spalten), diese zerhaut er dann und setzt oben 2 Bilder mit korrektem Abstand ein. Doch die beiden anderen bilder stehen mittig darunter untereinander.

Muß ich das eigentlich in der Datei einstellen oder kann ich das auch im TS oder CSS überschreiben lassen?

Weiß jemand rat?

Highco ·

Hab nun die Ausrichtung der Bilder auf "Mitte" gesetzt und in der Setup.txt datei von css_styles_Content die folgende Margin-left auf Margin:10px gestellt:

/* Pictures centered, add margin on left */
	DIV.csc-textpic-center DIV.csc-textpic-imagewrap .csc-textpic-image {
		display: inline; /* IE fix for double-margin bug */
		margin-left: {$styles.content.imgtext.colSpace}px;

Nun sind 3 Bilder mit dem Abstand nebeneinander und 1 darunter. Mir scheint das irgentwo die breite des DIV deklariert wird indem die Bilder liegen.

Hab jemand sowas schonmal gemacht? Wäre für hilfe sehr dankbar!