kleines Designproblem

Tabi · Beitrag von **Tabi** » 7. Apr 2009, 20:11

Hallo,
schätze ich finde eine CSS Einstellung nicht...Bei meinem Tabellendesign ist bei Zellen wo ein Bild am unteren Ende stehen soll jeweils eine leere Zeile:
http://www.fans.lilli-schwarzkopf.de/ad ... /index.php
Unterm Logo und am ende der Seite zu erkennen, dass trotz valign="bottom" unterhalb der Grafik eine Zeile noch vorhanden ist.
Kann mir einer helfen und sagen welche css Einstellung ich dafür vermutlich abändenr muss?
Vieln dank!
LG Tabi

P.S. Problem hab ich nur im Firefox, IE zeigt es korrekt an...

Mistert77 · Beitrag von **Mistert77** » 7. Apr 2009, 21:37

Hallo...

wollte gerade den selben Eintrag verfassen.
Ich habe genau das gleiche Problem.

Beim IE ist alles super. beim Firefox gibt es genau diese "leere" Zeile.

Ich arbeite an diesem Prolem schon seit 3 Tagen.

Habe im CSS code schon alle möglichen Sachen probiert und auch schon fast alles auskommentiert... ohne Erfolg.

Vielleicht kennt hier ja jemand das Problem und hat villeicht ne Läsung. wäre super!

Gruß

Jochen · Beitrag von **Jochen** » 8. Apr 2009, 08:20

Hallo,

auch wenn Tabelle eigentlich nicht zum Layouten gedacht sind....

Versuchs doch mal hiermit:

Code: Alles auswählen

<td colspan="3" align="left" background="http://www.fans.lilli-schwarzkopf.de/logo-a.jpg" width="845" height="254" border="0" style="padding: 0px; margin: 0px;" alt=""></td>

Gruß Jochen

Mistert77 · Beitrag von **Mistert77** » 8. Apr 2009, 08:46

Hallo,

ich habe das auch probiert bei mir -> ohne Erfolg...

ich bin auch hingegangen und habe in die system.css die folgenden Zeilen eingefügt:

Code: Alles auswählen

.TABLEMRT {
border: 0px;
margin: 0px;
padding: 0px; 
spcaing: 0px;
}

und habe meine Tabellen in "my_body_top.php"

folgendermaßen definiert:

Code: Alles auswählen

<table width="760" border="0" cellspacing="0" cellpadding="0">
  <tr> 

    <td rowspan="2" class=TABLEMRT><a href="index.php">...

hat aber auch keinen Erfolg gebracht!

Hat jemand vielleicht noch ne Idee?

bzw. hat jemand einen guten Link zu einem Tutorial wie ich Tabellen mit CSS gestalte?

oder @ Jochen: was würdest du verwenden antstatt Tabellen?!

DANKE

Jochen · Beitrag von **Jochen** » 8. Apr 2009, 09:17

Hallo,

die Klass muss im HTML Code jedenfalls schon mal in Anführungszeichen stehen also class="TABKEMRT".

@ Jochen: was würdest du verwenden antstatt Tabellen?!

Ich würde das ganze mit div, span und Listen bauen. So eine Kopfgrafik die nur eine Spalte breit ist braucht doch schon mal gar nicht in eine Tabelle rein.

Zum einlesen einfach mal hier durchklickern
http://www.css4you.de/wslayout1/

Gruß Jochen

matzman2000 · Beitrag von **matzman2000** » 8. Apr 2009, 10:14

Hallo Tabi,

zunächst mal würde ich grundsätzlich Jochen's Tipp folgen und versuchen, das Kionstrukt auf DIVs umzustellen. Zu Deinem Problem gibt es folgendes zu sagen:

Admidio verwendet XHTML, das ist im Dokumentenkopf auch angegeben

Code: Alles auswählen

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="de" xml:lang="de">

Lässt man Deine Seite durch den Validator laufen, fallen da schon einige Probleme auf.
Die Problematik liegt eindeutig in Grafiken, die in die Tabellen gelegt werden. Wenn Du die Tabellen weiterhin nutzen willst, musst Du Dir wohl oder übel etwas behelfen.

Deine Tabelle umschliesst den Admidio-Inhalt und könnte so geöffnet werden:

Code: Alles auswählen

<div align="center">
	<table border="0" cellpadding="0" style="border-collapse: collapse">
		<tr>
			<td colspan="3" background="http://www.fans.lilli-schwarzkopf.de/logo-a.jpg" width="845" height="254">
			&nbsp;</td>
		</tr>
		<tr>
			<td background="http://www.fans.lilli-schwarzkopf.de/links-menu-hg.jpg" width="149">
			<img border="0" src="http://www.fans.lilli-schwarzkopf.de/menu-a.jpg" width="150" height="258"></td>
			<td width="637">

Dann folgt der eigentliche Admidio-Inhalt und die tabelle wird so wieder geschlossen:

Code: Alles auswählen

</td>
			<td width="59" background="http://www.fans.lilli-schwarzkopf.de/rechts-a.jpg">&nbsp;</td>
		</tr>
		<tr>
			<td background="http://www.fans.lilli-schwarzkopf.de/links-u-a.jpg" width="150" height="74">
			&nbsp;</td>
			<td>&nbsp;</td>
			<td background="http://www.fans.lilli-schwarzkopf.de/rechts-u-a.jpg" width="59" height="74">
			&nbsp;</td>
		</tr>
		<tr>
			<td colspan="3" background="http://www.fans.lilli-schwarzkopf.de/unten-a.jpg" width="845" height="196">
			&nbsp;</td>
		</tr>
	</table>
</div>

Das ist nur eine Behelfslösung, ich empfehle die von Jochen angesprochene Umstellung...

Grus,
Matze

Mistert77 · Beitrag von **Mistert77** » 8. Apr 2009, 21:47

Hallo...

habe versucht mich mal in css container, etc. einzuarbeiten.

scheint mir wirklich die bessere Lösung zu sein.

Wenn ich aber versuche in einen Container 3 Bilder zu legen, die horizontal auf der gleichen Höhe liegen sollen direkt aneinander ohne Zwischenraum, dann bekomme ich im IE immer ein anderes Ergebnis als im FF.

... ich dreh gleich noch durch...

es sieht so aus als wäre da zwischen dem Container und dem Bild noch ein Rahmen....

Hat jemand ne Lösung für mich? ...

Ich versuche das Problem schon seit heute mittag zu lösen...

DANKE

Tabi · Beitrag von **Tabi** » 9. Apr 2009, 20:19

Ok, auf jeden Fall vielen dank für die Hilfe und die Tipps!!