Darstellungsprobleme Text mit Bild bei Firefox

Hallo,
bei mir ist das Problem, dass beim Firefox Text mit Bild nicht richtig klappt. Jeweils das erste Inhaltselement wird nicht richtig ausgegeben. Beim IE klappts. Als Bsp. folgende Url:http://www.sv-gerolstein.de/index.php?id=65
In einem anderen Bsp. Text mit Bild wird der Text unterhalb des Bildes mit einem viel zu großen Abstand dargestellt und das Bild selber klebt zu nahe an der Überschrift:http://www.sv-gerolstein.de/index.php?id=54
Hier mein CSS, falls das bei der Lösung hilft:
A:link {
color : navy;
text-decoration : none;
}

A:visited {
color : navy;
text-decoration : none;
}

A:hover {
color : navy;
text-decoration : underline;
}
A:active {
color : navy;
text-decoration : none;
}

h5,h6,div,p,body,html,input,button {
font: normal 12px verdana,arial,helvetica,sans-serif;
line-height:16px;
}

h1 {
font: normal 16px verdana,arial,helvetica,sans-serif;
font-weight: bold;
color:navy
}

h2 {
font: normal 12px verdana,arial,helvetica,sans-serif;
font-weight: bold;
color:navy;
}

h3 {
font: normal 14px verdana,arial,helvetica,sans-serif;
font-weight: bold;
color:black;
}

h4 {
font: normal 10px verdana,arial,helvetica,sans-serif;
font-weight: bold;
color:black;
}

img.block {
display:block;
}

div, img {
margin:0;
padding:0;
border:0;
}

div#container {
width:960px;
margin-left:auto;
margin-right:auto;
border:1px solid navy;
background: url(../fileadmin/images/background.gif) center repeat-y;
}

div#top {
font: bold 10px Verdana,Arial;
clear:both;
background-color:#000080;
text-align:right;
color:#FFFFFF;
padding:5px;
padding-right:10px;
}

div#top a {
text-decoration: none;
color:white;
}

div#header { background-color:navy; }

/*-----------------------------------*/

div#links {
float:left;
width:180px;
padding-top:10px;
padding-bottom:10px;
background-color:#1e90ff;
}

div#head {
font: normal 10px verdana,arial,helvetica,sans-serif;
padding-top:5px;
padding-bottom:5px;
}

div#head a {
text-decoration: none;
color:#000000;
}

div#center {
margin-left:190px;
width:580px;
}

div#right {
width:170px;
float:right;
height:auto;
text-align:left;
padding-top:10px;
padding-right:5px;
background-color:#D3E2F9;
}

.float-left {
float:left;
}

div#footer {
font: bold 10px Verdana,Arial;
clear:both;
background-color:#000080;
text-align:center;
color:#FFFFFF;
padding-top:5px;
padding-bottom:5px;
}

Ich hoffe es kann mir jemand weiterhelfen.
Danke

liegt wohl an

div#right {
width:170px;
}

georg

Hallo georg,
deine Antwort bezieht sich wohl auf den Conten in der rechten Spalte. Den Wert habe ich nun auch geändert und der Content in der rechten Spalte sieht jetzt auch besser auch, ausser dass noch ein blauer Rand um den Conten des tt_news LATEST fehlt. Der CSS-Code sieht wie folgt aus:

.news-latest-container {
	border:1px solid #navy;
	background-color:#FFFFFF;
	padding:2px;
}
.news-latest-container h2, .news-latest-gotoarchive {
	color:#fff;
	padding:3px;
	margin:0px;
	/*border:0px solid #666;*/
	background-color:navy;
}
.news-latest-item {
	/*padding-left:2px;*/
	/*padding-right:2px;*/
	/*border:0px solid #666;*/
	background-color:#FFFFFF;
}
.news-latest-date, .news-latest-morelink, .news-latest-category {
	font-size:9px;
}

Aber mein Hauptproblem ist nach wie vor, dass das Contentelement Text mit Bild in der Spalte normal nicht richtig klappt. Insbesondere bei Bild oben zentriert und Bild links. Dabei entspeht beim Firefox ein riesen Abstand zwischen dem Bild und dem Text.
Siehe Url:
http://www.sv-gerolstein.de/index.php?id=54
Gruß
Dieter

Hallo,
mir ist zu meinem Problem mit dem Contentelement "Text mit Bild" noch etwas im Quellcode aufgefallen.
Beim ersten Contentelement "Text mit Bild" steht u.a.:

<dl class="csc-textpic-image csc-textpic-lastcol" style="width:100px;">

bei den weiteren Contentelementen steht dagegen folgendes:

<dl class="csc-textpic-image csc-textpic-firstcol csc-textpic-lastcol" style="width:100px;">

Ist das richtig so?

das liegt wohl an

div#right {
float:right;
}

irgendwie scheint dein template etwas probleme zu haben

georg

Hallo georg,
was ist denn hieran falsch?

div#right {
float:right;
}

Was könnte denn mit meinem Template nicht stimmen bzw. welche Angaben wären nötig, um etwas näheres sagen zu können. Übrigens beim IE sieht alles ganz normal aus.
Gruß Dieter

stimmt denn das template in beiden browsern noch, wenn du es mit dummy content füllst

hab mir das template nicht genau genug angeschaut, sry

georg

Bei uns auf der Seite existiert genau das gleiche Problem. In den meisten Fällen läßt sich der Darstellungsfehler dadurch beheben, dass man den ersten Seiteninhalt (also Text/Bild) per html-Code eingibt. Dann tritt idR das Problem nicht mehr auf.

Wobei dadurch natürlich noch nicht die Ursache für das Problem geklärt wäre.

Wenn z.B. am Anfang der Seite eine Extension liegt die mit einem Suchfeld beginnt, ist das Layout auch sofort wieder hin und der nachfolgende Inhalt wird am unteren rechten Rand festgemacht. Interressanter Aspekt, löscht man das rechte Menü, "klebt" alles Links unten fest.

Hallo,

als 1. würde ich vorschlagen, Du macht erst mal valides CSS: http://jigsaw.w3.org/css-validator/ .. auf gerolstein.de sind jedemenge Fehler und Warnungen.

Erst DANN macht es Sinn, nach einer Lösung zu suchen. Nur soviel vorweg: FF hat Probleme mit float ohne width.

Gruß
crossi

Problem gelöst.
In der css-Datei im Centercontainer (div#center) ein
(overflow:hidden😉 einfügen dann ist die Darstellung wieder richtig.

Ursache des Problems, es steht vorher ein clear:both damit weiss der im center eingebettete Container nicht seinen Anfangspunkt und "setzt" sich hinter den letzten sichtbaren. Mit overflow:hidden wird rechts und links versteckt und damit der innenliegende Container wieder richtig positioniert.
Man muß den Randabstand für Center dann natürlich noch entsprechend anpassen, damit die Optik stimmt.

[/img]

Guggel, you made my day.

Habe es aber nicht in den Container geschrieben, da er mir dann den ganzen Container verschoben hat, sondern als

.csc-textpic {overflow:hidden;}

So hat es bei mir geklappt.

Ein frohes Wochenende euch allen

M;ke

PS. Schöne Grüße nach Gerolstein aus Wittlich.