nicht angemeldet
Tabellen Problem im IE7
Hallo,
ich hab das Problem das meine Tabelle im Firefox richtig, im Opera nur etwas nach rechts verschoben dargestellt wird aber im IE völlig "verzerrt"!
Glaube das ich einen Fehler in der CSS Datei habe. Aber wo? Habe auch schon sehr vieles ausprobiert aber der IE will sich nicht überreden lassen.
Hoffe mir kann geholfen werden, aber ich denke schon!
Die Tabelle:
code:
<div id="bg1"> <!-- Hintergrundbild mit Eigenschaften -->
<table id="table_01" Border="1"align="center">
<tr>
<th><b>Das bin ich:</b></th><th><b>Daten:</b></th>
</tr>
<tr>
<td><img src="Bilder/Chris.png" alt="Mein Bild" style="width:75%; height:90%; padding:1px"></img></td>
</tr>
</table>
</div>
CSS Datei Auszug:
Code:
#table_01 {
position:relative;
left:auto;
right:auto;
width:500px;
height:200px;
margin-left:25px;
margin-right:20px;
vertical-align:top;
}
#table_01 tr {
width:50%;
height:50%;
}
#table_01 td {
width:50px;
height:190px;
text-align:center;
}
#table_01 th {
width:50px;
height:10px;
text-align:center;
}
-
<td><img
src="Bilder/Chris.png"
alt="Mein Bild"
style="width:75%; height:90%; padding:1px"
></img></td>
^^^^^^
Da du uns den DOCTYPE verschweigst, können wir nicht sagen ob </img> Absicht ist.mfg Beat
--
Selber klauen ist schöner! -
Hallo Bully,
#table_01 {
position:relative;
left:auto;
right:auto;
}Sehr merkwürdige Konstruktion. Wo hast du das denn her?
Jonathan
-
Hallo Bully,
#table_01 {
position:relative;
left:auto;
right:auto;
}Sehr merkwürdige Konstruktion. Wo hast du das denn her?
Jonathan
Das kam durch's ausprobieren auf anderen Seiten. Hatte immer funktioniert.
Ist das falsch oder einfach nur unüblich?-
Hallo.
Ist das falsch oder einfach nur unüblich?
Es ist vollkommen korrekt. Nur weiß hier niemand, wie es aussehen soll und ob dein Code dafür geeignet sein kann.
Überhaupt wirkt die Formatierung deiner Tabelle nicht so, als ob du damit tabellarische Daten darstellen wolltest.
MfG, at-
Hallo.
Ist das falsch oder einfach nur unüblich?
Es ist vollkommen korrekt. Nur weiß hier niemand, wie es aussehen soll und ob dein Code dafür geeignet sein kann.
Überhaupt wirkt die Formatierung deiner Tabelle nicht so, als ob du damit tabellarische Daten darstellen wolltest.
MfG, atNun das soll eine Tabelle werden mit zwei Spalten und drei bis vier Zeilen!
Bei den zwei spalten sollen im th- Bereicht die Überschrift stehen im ersten td-Bereich soll dann erstmal mein Bild und dann ein paar Daten von mir und in den folgenden soll halt das ganze so fortgesetzt werden.
Da ganze ist kein Layout, das liegt schon im Hintergrund. Sondern einfach nur eine auf einem Bereich der Seite angezeigte Zweispaltige Tabelle mit rechts Daten und links Bilder mit evtl. Untertitel.
Das sind aber nur 4 Bilder! Also 9 Zeilen mit th jetzt.Hab jetzt auf einer anderen Hilfeseite gelesen das irgendetwas mit meinem Dok-typ nicht richtig sein soll! Nun meine Frage, was ist an folgenden falsch hat doch bis jetzt funktioniert?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">-
Hallo.
Nun das soll eine Tabelle werden mit zwei Spalten und drei bis vier Zeilen!
Zwei Spalten zu jeweils 50px Breite in Reihen zu jeweils 50 Prozent der Gesamtgröße von 500px.
Bei den zwei spalten sollen im th- Bereicht die Überschrift stehen
In Zellen mit jeweils 10px Höhe.
im ersten td-Bereich soll dann erstmal mein Bild und dann ein paar Daten von mir und in den folgenden soll halt das ganze so fortgesetzt werden.
Aber nicht länger als 190px.
Da ganze ist kein Layout, das liegt schon im Hintergrund.
Du hast also in Photoshop oder seinen Brüdern ein starres Layout entworfen und versuchst nun, deine Seite in dieses pixelbasierte Layout einzupassen.
Pixelgenaue Angaben mit Prozentwerten automatischer Plazierung zu verwenden, lässt Browsern aber einen gewissen Spielraum, zumal wenn die Angaben in sich nicht schlüssig wirken. Hinzu kommt die Formatierung über dasstyle-Attribut oder die Verwendung desborder-Attributes, wodurch andere Eigenschaften überschrieben werden könnten. Du solltest also insgesamt sauberer schreiben.Hab jetzt auf einer anderen Hilfeseite gelesen das irgendetwas mit meinem Dok-typ nicht richtig sein soll! Nun meine Frage, was ist an folgenden falsch hat doch bis jetzt funktioniert?
Unter der Voraussetzung, dass du tatsächlich XHTML 1.0 verwendest, ist der völlig korrekt. Ist dein Code insgesamt valide? Stelle doch vielleicht einmal die vollständige Seite sowie ein Bild der Zielvorgabe ins Netz, damit man sich einen eigenen Eindruck machen kann.
MfG, at-
Unter der Voraussetzung, dass du tatsächlich XHTML 1.0 verwendest, ist der völlig korrekt. Ist dein Code insgesamt valide? Stelle doch vielleicht einmal die vollständige Seite sowie ein Bild der Zielvorgabe ins Netz, damit man sich einen eigenen Eindruck machen kann.
Korrekt schon. Fraglich ist aber, ob der IE das XHTML ausreichend gut versteht. Bei so Konstruktionen wie <img ...></img> wäre ich mir da nicht so sicher.
Jonathan
-
Korrekt schon. Fraglich ist aber, ob der IE das XHTML ausreichend gut versteht. Bei so Konstruktionen wie <img ...></img> wäre ich mir da nicht so sicher.
Jonathan
Hmm, hat der IE damit Probleme? Wie sollte ich das denn schreiben wenn ich ein Bild einfügen möchte, sodass der IE das richtig interpretieren kann?
Wichtig:Ich glaube ich habe gerade einsehen müssen das ich ein Vollidiot bin...ich habe zweimal den Verweis zu meiner css Datei im Head Bereich stehen.
Jetzt wo ich das entfernt habe sieht es auch unterm IE recht positiv aus!
Wieso ist das denn mir erst jetzt aufgefallen!Aber ist das denn bis jetzt so richtig, auf Anspielung auf den DOK-Typ?
Wenn nein ändere ich das, sodass es konform ist? Spiel jetzt wiederum auf das img-prob an.So sieht der Code für die Gesamte Seite aus:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Chris Homepage</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><meta name="Description" content="Christopher's Private Homepage mit links für Tutorials und sonstigen" />
<meta name="Keywords" content="Carola, Andreas, 3dl.am, sfx, Photoshop, html, php, Javascript" />
<meta name="author" content="BullyonN++" />
<meta name="robots" content="index, follow" />
<meta name="pragma" content="nocache" />
<meta name="reviset-after" content="5days" />
<meta name="Content-Language" content="de" />
<meta name="Language" content="German, de, deutsch" />
<meta name="date" content="2008-04-30T09:40:22+2:00" /><link rel="shortcut icon" type="image/x-icon" href="Bilder/Favicon.ico" />
*<link rel="stylesheet" href="./Design.css" type="text/css" />**<link rel="stylesheet" href="./Design.css" type="text/css">*
</head><body style="background-image:url(Bilder/back.gif)"><div align="center">
<div id="Tabelle_01">
<div id="Homepage-01_">
<a href="index.html">
<img id="Homepage_01" src="Bilder/Homepage_01.png" width="800" height="143" border="0" alt="" /></a>
</div>
<div id="Homepage-02_">
<img id="Homepage_02" src="Bilder/Homepage_02.gif" width="800" height="3" alt="" />
</div>
<div id="Homepage-03_">
<img id="Homepage_03" src="Bilder/Homepage_03.gif" width="121" height="34" alt="" />
</div>
<div id="Homepage-04_">
<a href="index.html">
<img id="Homepage_04" src="Bilder/Homepage_04.png" width="92" height="34" border="0" alt="" /></a>
</div>
<div id="Homepage-05_">
<a href="Freunde.html">
<img id="Homepage_05" src="Bilder/Homepage_05.png" width="244" height="34" border="0" alt="" /></a>
</div>
<div id="Homepage-06_">
<a href="links.html">
<img id="Homepage_06" src="Bilder/Homepage_06.png" width="90" height="34" border="0" alt="" /></a>
</div>
<div id="Homepage-07_">
<a href="ueber_mich.html">
<img id="Homepage_07" src="Bilder/Homepage_07.png" width="133" height="34" border="0" alt="" /></a>
</div>
<div id="Homepage-08_">
<img id="Homepage_08" src="Bilder/Homepage_08.gif" width="120" height="34" alt="" />
</div>
<div id="Homepage-09_">
<img id="Homepage_09" src="Bilder/Homepage_09.png" width="121" height="597" alt="" />
</div>
<div id="Homepage-11_">
<img id="Homepage_11" src="Bilder/Homepage_11.png" width="559" height="47" alt="" />
</div>
<div id="Homepage-11011_">
<img id="Homepage_11011" src="Bilder/Homepage_11-11.png" width="120" height="597" alt="" />
</div>
<div id="bg3"></br>
</div>
<div id="bg1">
<table id="table_01" Border="1"align="center" cellpadding="0" cellspacing="0">
<tr>
<th><b>Das bin ich:</b></th><th><b>Persönlich Daten:</b></th>
</tr>
<tr>
<td><img src="Bilder/Chris.png" alt="Mein Bild" style="width:75%; height:90%; padding:1px"></img></td>
</tr>
</table>
</div>
<div id="bg2">
<div id="img1"><a href="mailto:mailto:bully.online@freenet.de"></div></a>
</div>
</div>
</body>
</html>und hier das bild:
http://img3.imagebanana.com/img/eqql7rl7/Home.jpg-
Hallo Bully,
Hmm, hat der IE damit Probleme? Wie sollte ich das denn schreiben wenn ich ein Bild einfügen möchte, sodass der IE das richtig interpretieren kann?
Nicht
<img src="Bilder/Chris.png" alt="Mein Bild" style="width:75%; height:90%; padding:1px"></img>
sondern
<img src="Bilder/Chris.png" alt="Mein Bild" style="width:75%; height:90%; padding:1px" />
ich bin mir nicht hunderprozentig sicher, dass das Probleme macht, aber letzteres ist sowieso kürzer und ünlicher und auch eher kompatibel zu HTML.
Jonathan
-
Hallo.
Hmm, hat der IE damit Probleme?
Möglicherweise, aber ich weiß nichts davon.
Wie sollte ich das denn schreiben wenn ich ein Bild einfügen möchte, sodass der IE das richtig interpretieren kann?
Mit einem leeren Element, also so, wie du es jetzt gemacht hast.
Wichtig:Ich glaube ich habe gerade einsehen müssen das ich ein Vollidiot bin...ich habe zweimal den Verweis zu meiner css Datei im Head Bereich stehen.
Das sollte nichts ausgemacht haben.
Jetzt wo ich das entfernt habe sieht es auch unterm IE recht positiv aus!
Dann wirst du auch an anderer Stelle etwas verändert haben, oder dein Dokument ist nach wie vor nicht valide.
Wieso ist das denn mir erst jetzt aufgefallen!
Weil du nicht validierst.
Aber ist das denn bis jetzt so richtig, auf Anspielung auf den DOK-Typ?
Nein.
Wenn nein ändere ich das, sodass es konform ist?
Ja, bitte.
<meta name="Description" content="Christopher's Private Homepage mit links für Tutorials und sonstigen" />
<meta name="Keywords" content="Carola, Andreas, 3dl.am, sfx, Photoshop, html, php, Javascript" />
<meta name="author" content="BullyonN++" />
<meta name="robots" content="index, follow" />
<meta name="pragma" content="nocache" />
<meta name="reviset-after" content="5days" />
<meta name="Content-Language" content="de" />
<meta name="Language" content="German, de, deutsch" />
<meta name="date" content="2008-04-30T09:40:22+2:00" />Das alles sollte meist unnötig sein.
<link rel="shortcut icon" type="image/x-icon" href="Bilder/Favicon.ico" />
Verwende besser durchgängig Kleinschreibung, um Verwechselungen zu vermeiden.
*<link rel="stylesheet" href="./Design.css" type="text/css" />*
*<link rel="stylesheet" href="./Design.css" type="text/css">*
Einmal richtig, einmal falsch. "./" verweist auf das aktuelle Verzeichnis, ist also überflüssig. Die Sternchen gehören hoffentlich nicht dazu.
<body style="background-image:url(Bilder/back.gif)">
Wieder CSS im
style-Attribut, obwohl du eine externe CSS-Ressource verwendest.<div align="center">
Wieder eine HTML-Formatierung, obwohl du CSS verwendest.
<div id="Tabelle_01">
Auch bei ID oder Klassen empfiehlt sich die durchgängige Kleinschreibung. Und warum verwendest du plötzlich
<div>? Wenn es sich um eine Tabelle handelt, verwende bitte das passende Element. Wenn es sich um eine Definitionsliste handelt, verwende bitte das passende Element. Wenn es sich um einen Haufen Müll handelt, verwende einen Haufen<div>.<div id="Homepage-01_">
<a href="index.html">
<img id="Homepage_01" src="Bilder/Homepage_01.png" width="800" height="143" border="0" alt="" /></a>
</div>Beachte, wo bei dieser Notation Leerzeichen entstehen und wo nicht. Und wieder formatierst du in HTML. Und fehlende Alternativtexte sind ein sicheres Zeichen für die Irrelevanz der Bilder.
<div id="bg3"></br>
Du schließt einen Zeilenumbruch, den du nicht geöffnet hast. Die korrekte Schreibweise lautet:
<br />, die korrekte Nutzungsweise in diesem Fall: gar nicht.<table id="table_01" Border="1"align="center" cellpadding="0" cellspacing="0">
borderschreibt sich klein; Attribute werden durch Leerzeichen voneinander getrennt.<tr>
Befasse dich bitte noch mit dem Aufbau von Tabellen.
<th><b>Das bin ich:</b></th><th><b>Persönlich Daten:</b></th>
</tr>
<tr>
<td><img src="Bilder/Chris.png" alt="Mein Bild" style="width:75%; height:90%; padding:1px"></img></td>
</tr>Die zweite Zeile hat weniger Zellen als die erste.
<div id="img1"><a href="mailto:mailto:bully.online@freenet.de"></div></a>
Die Verschachtelung ist falsch; die Codierung blödsinnig.
</div>
Ich hoffe mal, dass die Zahl der schließenden Tags mit der der öffnenden übereinstimmt.
Ob dein Code weitere Fehler enthält, findest du bitte selbst heraus. Und mit Fragen zu CSS-Problemen geht es erst weiter, wenn dein HTML validiert.
Du hast noch viel zu lernen.
MfG, at
-
-
-
-
-
-
-