[triple.u]

Moin!

Habe folgendes Problem:

Ich habe ein Bild mit Text, Bild 600x250 Pixel.
Zwischen Text und Bild ca. 200px Abstand.

Habe viel gesucht und probiert, kriege es nicht weg...
Habe dann vorerst weitergemacht. Nächste Seite hat
die gleiche Konstellation - aber das Bild ist 600x450px.

Und siehe da: KEIN Abstand!
Also scheint irgendwo eine mindesthöhe oder so notiert zu sein.
ABER WO???

Kann mir jmd. helfen?

Links:
khironis.de: Die Gruppe (mit Abstand) ALTE ADRESSE
khironis.de: Aktuelles (ohne Abstand) ALTE ADRESSE

khironis.de: Die Gruppe - mit Abstand
khironis.de: Aktuelles - ohne Abstand

Danke

Wilfried

(Ach so: Beide haben die gleichen Templates & CSS)

[longhook]

Hallo Wilfried,

eine Lösung habe ich zwar noch nicht, aber ich bewundere das Problem ...

Mir ist aufgefallen, dass die beiden Seiten nicht ganz identisch sind. Das korrekt dargestellte Layout wird mit einem zentrierten, das fehlerhafte mit einem linksbündigen Bild generiert. Kannst Du auf dieser Basis das Problem mit anderen Bildern von ähnlichem Format auf anderen Seiten nachstellen?

Ansonsten: Welche Anpassungen hast Du bislang an den CSS-Auszeichnungen gemacht? Vielleicht lohnt es sich, nochmals manuell für das jeweilige Element height, margin, padding etc. anzugeben, bzw. es anzupassen?

Viele Grüße

longhook

[triple.u]

Hallo!

Komme gerade nicht auf den Server, muss mir das aber mal ansehen...

Die einzige CSS-Anweisung zu Bildern (IMG) bei mir ist "padding:0px; margin:0px; border:0px" ... Also hier dran liegt es nicht.

Ich werde euch auf dem laufenden halten...


W.

[longhook]

Hallo Wilfried,

noch eine kleine Präzisierung meinerseits: Das Problem, sofern es denn mit den CSS-Auszeichnungen zusammenhängt, muss nicht zwingend direkt am <img>-Tag liegen. Die "Text-mit-Bild"-Elemente sind aus zahlreichen Tags aufgebaut: ein globaler Layer, in diesem je einer für den Bild- und den Textbereich und in diesen wiederrum aus einer Definitionlist (<dl>) für das Bild und den Text-Tags. Ein Blick in den Quelltext gibt auch über die jeweiligen CSS-Klassen Aufschluss.

Auf welcher "Ebene" sich dann wer mit wem in die Quere kommt, könnte nur ein Blick in die gesamte CSS-Datei klären.

Im Übrigen ist die Darstellung im IE7 zwar auch fehlerhaft, aber auf etwas andere Weise: Hier ist noch vor der <h1>-Überschrift der mysteriöse Abstand ...

Bin auf die endgültige Lösung gespannt! Viel Erfolg!

[mensch]

Moin, es ist ein CSS-Problem. Das kannst Du glaube ich am einfachsten durch nachfolgenden Vergleich ausloten:
BILDABSTAND KLAPPT:

<!--  Image block: [begin] -->
<div class="csc-textpic csc-textpic-center csc-textpic-above">
<div class="csc-textpic-imagewrap" style="width:600px;">
<dl class="csc-textpic-image csc-textpic-firstcol csc-textpic-lastcol" style="width:600px;">
<dt><img src="uploads/pics/Aktuelles_vorl.jpg" width="600" height="450" border="0" alt="" /></dt>
</dl>
</div>
<div class="csc-textpic-text">
<!--  Text: [begin] --><p class="bodytext">... sind </p><!--  Text: [end] -->
</div>
</div>
<div class="csc-textpic-clear"><!-- --></div>
<!--  Image block: [end] -->

BILDABSTAND KLAPPT NICHT:

<!--  Image block: [begin] -->
<div class="csc-textpic csc-textpic-left csc-textpic-above">
<div class="csc-textpic-imagewrap">
<dl class="csc-textpic-image csc-textpic-firstcol csc-textpic-lastcol" style="width:600px;">
<dt><img src="uploads/pics/Grp.jpg" width="600" height="232" border="0" alt="Gruppenbild" /></dt>
</dl>
</div>
<div class="csc-textpic-text">
<!--  Text: [begin] --><p class="bodytext">Unsere ........</p><!--  Text: [end] -->
</div>
</div>
<div class="csc-textpic-clear"><!-- --></div>
<!--  Image block: [end] -->

Schau Dir folgendes an:
2. Zeile
<div class="csc-textpic csc-textpic-center csc-textpic-above">
<div class="csc-textpic csc-textpic-left csc-textpic-above">

3. Zeile
<div class="csc-textpic-imagewrap" style="width:600px;">
<div class="csc-textpic-imagewrap">

LG Mensch

[msalw]

Hi,

also es liegt an deinem Menu:
#menu
height:340px;

schiebt dir den Text nach unten...

Du solltest Template und CSS mal überprüfen.

[edit]
Bau dein Template wie folgt auf(ohne position:absolute;:sad:

<div id="website">
<div id="container">
<div id="leftSide">
<div id="logo"></div>
<div id="subMenu"></div>
</div>
<div id="rightSide">
<div id="header">
<div id="headerImage"></div>
<div id="mainMenu"></div>
</div>
<div id="contentArea">
<div id="content"></div>
</div>
</div>
</div>
</div>

musst halt css anpassen! Aber so sollte es sauber sein, kannst die ids auch umbenennen...
[/edit]

gruß Markus

[triple.u]

Moin!

Danke an alle...

Mit Menu werde ich zwar nochmal prüfen, aber da das menu mit FLOAT eingebunden ist und außerdem VOR der Headline der Seite, glaube ich nicht, dass es am Menü liegt.

Die Lösung von Mensch erscheint mir logischer und deckt sich mit meinen Erfahrungen. Aber: WO VERÄNDERE ICH DAS?? Das sind css-Werte von Typo3, nicht von mir... Wo finde ich die csc-...-Definitionen und kann sie ändern??

Weiß das jemand?

Wilfried

PS: Wenn ich anstelle des kleinen Bildes bei khironis.de: Die Gruppe
ein großes reinsetze, habe ich KEINEN Abstand.

[msalw]

Also ich hab es mit Firebug getestet und die Höhe deines Menus deaktiviert und der Fehler war weg...

nimm die höhe deines Menus mal weg und du wirst sehen das es daran liegt -.- ...

[mensch]

Moin triple.u,

ich liege verkehrt, msalw hat recht, es ist Dein:

	<div id="menu">
		<div> Mitmachen! </div>
	</div>

Ach ja, Deine Seiten sehen in Opera anders als im IE aus. Du solltest auf jeden Fall Deine Seiten auf mehreren Browsern testen.

LG Mensch

[msalw]

Am besten das Template nochmal sauber aufbauen + CSS ;)