Tabellenelemte mit fixen Höhenangaben falsch im IE7
Benjamin
- html
Hallo Ihrs,
könnte ihr mir verraten wieso folgender HTML Code nicht so angezeigt wird wie ich es mir vorstelle:
<table height="500px" width="500px" cellpadding="0" cellspacing="0">
<tr>
<td rowspan="3" width="10px" bgcolor="#ff0000"></td>
<td height="10px" bgcolor="#00ff00"></td>
<td rowspan="3" width="10px" bgcolor="#ff0000"></td>
</tr>
<tr>
<td class="content">content</td>
</tr>
<tr>
<td heigIch möchte dass die Tabelle einenht="10px" bgcolor="#00ff00"></td>
</tr>
</table>
Die mittlere (weiße) Zelle soll den Inhalt repräsentieren und die Äußeren den Rahmen (rot + grün). Allerdings soll der Rahmen IMMER nur 10px breit oder hoch sein und die Contentzelle soll den restlichen Inhalt einnehmen OHNE dass ich ihr eine fixe Höhe oder Breite zuweise.
IE8 + FF + Safari + Opera stellen es wunderbar dar. Nur eben nicht der IE7. Quirksmode ist keine Alternative.
Würde mich über eine Antwort freuen und bedanke mich schonmal im Vorraus.
Tach,
IE8 + FF + Safari + Opera stellen es wunderbar dar. Nur eben nicht der IE7. Quirksmode ist keine Alternative.
dein Code ist nicht valide (height- und width-Attribute erwarten einen Zahlenwert ohne Maßeinheit, das table-Element kenn kein height-Attribut), die eine Fehlerkorrektur tut was du willst, die andere nicht.
Verwende CSS um die Formatierungswünsche umzusetzen.
mfg
Woodfighter
dein Code ist nicht valide (height- und width-Attribute erwarten einen Zahlenwert ohne Maßeinheit, das table-Element kenn kein height-Attribut), die eine Fehlerkorrektur tut was du willst, die andere nicht.
Hab ich alles schon versucht. Angaben ohne "px" und alles über css formatiert, es funktioniert trotzdem nicht.
Hier der Code mit css Formatierung:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Testprojekt</title>
<style type="text/css">
body{
background-color: #3c7dcd;
}
table{
width:500px;
height:500px;
border-collapse:collapse;
}
.content{
background-color:#fff;
padding:10px;
}
.borderHorizontal{
height:10px;
background-color:red;
}
.borderVertical{
width:10px;
background-color:green;
}
</style>
</head>
<body>
<h1>Testprojekt</h1>
<table>
<tr>
<td rowspan="3" class="borderVertical"></td>
<td class="borderHorizontal"></td>
<td rowspan="3"class="borderVertical"></td>
</tr>
<tr>
<td class="content">content</td>
</tr>
<tr>
<td class="borderHorizontal"></td>
</tr>
</table>
</body>
</html>
Es funktioniert trotzdem nicht.
@@Benjamin:
nuqneH
Die mittlere (weiße) Zelle soll den Inhalt repräsentieren und die Äußeren den Rahmen (rot + grün).
Nein nein nein.
Du hast keine Zellen, weil du keine Tabelle hast, weil du keine tabellarischen Daten hast. Missbrauche das 'table'-Element nicht zum Layouten!
Für sämtliche Darstellungsangaben ist http://de.selfhtml.org/css/index.htm@title=CSS da; für http://de.selfhtml.org/css/eigenschaften/rahmen.htm@title=Rahmen die 'border-…'-Eigenschaften.
Im HTML:
<div class="content">content</div>
Im Stylesheet:
div.content
{
border-top: 10px solid #00ff00;
border-right: 10px solid #ff0000;
border-left: 10px solid #ff0000;
}
Qapla'
Du hast keine Zellen, weil du keine Tabelle hast, weil du keine tabellarischen Daten hast. Missbrauche das 'table'-Element nicht zum Layouten!
Ich weiß ich weiß ich weiß.
Die Gründe weshalb ich eine Tabelle nehmen möchte/muss ist folge:
Ich möchte auch gar keine Diskussion über die Existenzberechtigung von Tabellen führen sonderne einfach nur eine Lösung für mein Problem finden.
@@Benjamin:
nuqneH
Die Gründe weshalb ich eine Tabelle nehmen möchte/muss ist folge:
- der Rahmen soll später transparent sein und das geht mit einer Tabelle am einfachsten
Dein aktuelles Problem mit IE 7 zeigt das Gegenteil.
das klappt mit Tabellen am besten weil […]
Dein aktuelles Problem mit IE 7 zeigt das Gegenteil.
keine verschachtelten divs mit alphatransparenten Hintergrundbildern die sowieso nicht richtig dargestellt werden können
??
Ich möchte […] einfach nur eine Lösung für mein Problem finden.
Einfache Lösung: kein 'table'-Element zum Layouten nehmen.
Qapla'
Ok, ich versuche es nochmal:
Gibt es eine Möglichkeit Tabellenelementen eine feste Höhe zu geben sodass Tabellenelemente in der gleichen Zeile automatisch auf diese Höhe vergrößert werden?
Wenn ja welche?
Ich hab eie einfache Frage und würde mich über eine einfache Antwort freuen.
@@Benjamin:
nuqneH
Ok, ich versuche es nochmal:
[…]
Ich hab eie einfache Frage und würde mich über eine einfache Antwort freuen.
OK, ich versuche es nochmal:
Vernünftiges[tm] Markup gestylt mit CSS ist einfacher als Tabellenlayout.
Qapla'
OK, ich versuche es nochmal:
Vernünftiges[tm] Markup gestylt mit CSS ist einfacher als Tabellenlayout.
Qapla'
Wahnsinn, noch nicht mal ne einfache Ja/Nein Frage ist beantwortbar.
Danke, hast mir sehr geholfen.
@@Benjamin:
nuqneH
Wahnsinn, noch nicht mal ne einfache Ja/Nein Frage ist beantwortbar.
Wie oft soll ich dir die einfache Ja/Nein-Frage* „Soll ich 'table' zum Layouten missbrauchen“ denn nocht mit Nein beantworten?
Danke, hast mir sehr geholfen.
Gerngeschehn.
Qapla'
Wenn du mit deiner »Hilfe« (Herunterleiern von Dogmen) nicht ankommst, wird es nicht besser, wenn du Leuten nur noch mehr mit sturer Besserwisserei auf die Nerven fällst. Damit erreichst du, wie man hier einmal wieder siehst, nur das absolute Gegenteil: Du bringst die Fragesteller zur Weißglut.
Mathias
@@molily:
nuqneH
Wenn du mit deiner »Hilfe« (Herunterleiern von Dogmen) nicht ankommst […]
Wirst du hier jetzt zum Über-Moderator?
Du bringst die Fragesteller zur Weißglut.
Wenn der OP auch bei dritten Mal immer noch nicht einsehen will, dass man Browserbugs (wie du selbst sagtest, handelt es sich um einen solchen) am einfachsten dadurch umgeht, dass man sie gar nicht erst aufkommen lässt, dann sag ich es ihm auch noch ein viertes Mal. Das ist kein „Herunterleiern von Dogmen“, sondern von Tatsachen.br />
Ob dem OP diese Tatsache nun gefällt oder nicht, ändert nichts daran, dass Tabellen auch deshalb nicht zum Layouten geeignet sind, weil jeder Browser seine eigenen Vorstellungen von deren Rendering hat.
Qapla'
Hallo,
Wirst du hier jetzt zum Über-Moderator?
Muss er nicht, aber ab und zu muss man dir sagen, dass du nicht so hart mit Fragenden ins Gericht gehen sollst.
Grüße
Thomas
Gibt es eine Möglichkeit Tabellenelementen eine feste Höhe zu geben sodass Tabellenelemente in der gleichen Zeile automatisch auf diese Höhe vergrößert werden?
Was meinst du mit Tabellenelementen? Zellen, also th- und td-Elemente? Oder table-Elemente?
Alle Zellen einer Zeile (tr) sind natürlich gleich hoch - so hoch, wie die höchste Zelle. Was meintest du genau?
Was du im Ursprungsposting gefunden hast, ist einfach ein IE-7-Bug, den man, wenn du unbedingt bei Tabellen bleiben willst, wahrscheinlich höchstens mit CSS-Expressions bzw. direkt JavaScript lösen könnte - indem man der mittleren Zelle eine errechnete feste Höhe gibt.
Mathias
Was meinst du mit Tabellenelementen? Zellen, also th- und td-Elemente? Oder table-Elemente?
Einem td-Element.
Alle Zellen einer Zeile (tr) sind natürlich gleich hoch - so hoch, wie die höchste Zelle. Was meintest du genau?
Ich wollte die td's welche den Rahmen darstellen eine feste Höhe bzw. Breite geben sodass sich das mittlere td-Element automatisch aufspannt. Schade, dass der IE7 bei so einem doch sehr einfachem Aufbau scheitert.
Was du im Ursprungsposting gefunden hast, ist einfach ein IE-7-Bug, den man, wenn du unbedingt bei Tabellen bleiben willst, wahrscheinlich höchstens mit CSS-Expressions bzw. direkt JavaScript lösen könnte - indem man der mittleren Zelle eine errechnete feste Höhe gibt.
Leider ist es mit einem einfachen vergeben von Höhen nicht getan. Die Boxen verändern im laufenden Betrieb sowohl die Höhe als auch die Breite in Animationen.
- der Rahmen soll später transparent sein und das geht mit einer Tabelle am einfachsten indem ich den Zellen die ich für den Rahmen misbrauche eine transparente Hintergrundfarbe gebe
Dann suchst du wohl eher Abstände, also margin oder padding.
- die Boxen sind Bestandteil einer großen Javascript Anwendung die Höhen berechnet/vererbt und das klappt mit Tabellen am besten weil es nur ein Element ist
Ein div-Container hat auch eine offsetHeight-Eigenschaft, die die Gesamthöhe der Boxen der Kindelemente (im normalen Fluss) wiedergibt. Es wäre insofern auch »nur ein Element«.
Außerdem: Wenn du eh mit JavaScript irgendwelche Höhen berechnest, kannst du in dem Zug nicht das IE-7-Problem lösen?
Mathias
Außerdem: Wenn du eh mit JavaScript irgendwelche Höhen berechnest, kannst du in dem Zug nicht das IE-7-Problem lösen?
Jetzt mach ich es tatsächlich so. Ist zwar leider nur ein Workaround aber es funktioniert. Trotzdem Danke.