[IE] Border abgehackt

Buhmann · 10.05.2005, 09:18

Hi,
ich habe gerade wider ein ungewöhnliches Problem mit dem Ie, bei Opera ist es aber nicht der Fall.

Auf der Seite http://buhmann.bu.funpic.de/quilts/index.php (ist noch im Aufbau) Habe ich eine Tabelle mit einem Rahmen gemacht, der unten aber einfach "abgehackt" ist, d.h. der IE beendet dort die Seite, wo der Border anfangen sollte.
Ich habe schon alles versucht (z.b. ein <span> mit festgesetzter größe von 10px darunter zu hängen) aber nichts hilft.

Da die Seite derzeit im Auf- und Umbau ist, poste ich hier mal der Quelltext:

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
	<head>
		<title>Quilts 'n' Books  -  Das Paradis für alle Fans von Büchern und Quilts</title>
		<style type="text/css">
		<!--
			body {
 				background-color: #89CC65;	
				color: #000000;
			}
			
			/* Links */
			a:link {
			 color: #202020;
			 text-decoration: underline;
			}    /* noch nicht besuchte Ziele */
			a:visited {
			 color: #202020;
			 text-decoration: underline;
			} /* besuchte Ziele */
			a:hover {
			 color: #202020;
			 text-decoration: none;
			}   /* Verweise bei "MouseOver" */
			a:active {
			 color: #202020;
			 text-decoration: underline;
			}  /* Angeklickte Verweise */
			a:focus {
			 color: #202020;
			 text-decoration: underline;
			}   /* Verweise, die Fokus erhalten */
			
			.main {
				position:absolute;
				left:20px;
				width:800px;
				top:100px;
 				background-color: #89CC65;	
				color: #000000;
				height:100%;
				border: 6px solid #FB824E;	
			}
			.header {
				position:absolute;
				left:50px;
				width:740px;
				top:20px;
				height:60px;
				vertical-align:middle;
			}
			.headertd {
				vertical-align:middle;
				text-align:center;
				width:20%;
			}
			.menu {
				width:20%;
				cursor: pointer;
				border: 1px solid #000000;
				height: 5px;
			}
			.menu2 {
				width:20%;
				height: 5px;
			}
			.content {
				width:80%;
				height:100%;
				border: 1px solid #000000;
				vertical-align: top;
			}
			img {
				border-width: 0px;
			}
			.spacer {
				
				height:100%;
			}
			.space {
				
				height:10px;
			}
			-->
		</style>
		<script type="text/javascript">
			function goto_site(p) {
				s = "index.php?page=" + p;
				window.location.href= s;
			}
		</script>
	</head>
	<body>
		<table class="header">
			<tr>
				<td class="headertd">
					[img]images/quilts/BridgeOfSighs.jpg[/img]
				</td>
				<td class="headertd">
					[img]images/quilts/springstar2.jpg[/img]
				</td>
				<td class="headertd">
					[img]images/quilts/belleoftheball2.jpg[/img]
				</td>
				<td class="headertd">
					[img]images/quilts/Dovetails.jpg[/img]
				</td>
				<td class="headertd">
					[img]images/quilts/nationalchampion.jpg[/img]
				</td>
			</tr>
		</table>
		<table class="main">
			<tr>
				<td class="menu" onmouseover="this.style.background='#69AC45'" onmouseout="this.style.background='#89CC65'" onclick=" goto_site('news')">News & Wissenswertes</td>
				<td rowspan="6" class="content">blablalba</td>
			</tr>
			<tr>
				<td class="menu" onmouseover="this.style.background='#69AC45'" onmouseout="this.style.background='#89CC65'" onclick="goto_site('quilts')">Quilts</td>
			</tr>
			<tr>
				<td class="menu" onmouseover="this.style.background='#69AC45'" onmouseout="this.style.background='#89CC65'" onclick="goto_site('buecher')">Bücher</td>
			</tr>
			<tr>
				<td class="menu" onmouseover="this.style.background='#69AC45'" onmouseout="this.style.background='#89CC65'" onclick="goto_site('impressum')">Impressum</td>
			</tr>
			<tr>
				<td class="spacer" ></td>
			</tr>
			<tr>
				<td class="menu2">Besucher: 5
Rekord: 5 (10. 05. 05)</td>
			</tr>
		</table>
	</body>
</html>

Vielen Dank schonmal im vorraus für alle die sich zeit nehmen sich mit diesem Problem zu befassen.

Ps.: Der Code ist natürlich Valide.

[EDIT]
Mir ist aufgefallen, dass es wahrscheinlich damit zusammenhängt, dass die tabelle eine Absolute position hat und IE wohl einen kleinen Bug bei der Interpretationd er zugegeben nicht ganz reinen Angabe height: 100% hat. Denn als ich ein Element mithilfe von Position:absoulte darunter setzte, wurde der border angezeigt. Aber da ist die Frage: Wie stelle ich sicher, dass sich ein Element unter der Tabelle befindet, wenn ich doch garnicht exakt weiß, wie hoch diese ist?

Buhmann · 13.05.2005, 22:29

Weiß echt keiner eine lösung?
Ich brauch das ziemlich dringend, weil die page n Geburtstagsgeschenk werden soll und ich bin schon am verzweifeln, nichts scheint zu klappen...

*bump*

13.05.2005, 23:07

Hmmmm, hab' jetzt grade keinen IE zur Verfügung, setz doch mal

Code:

body {
    margin:0;
    padding:0;
}

ein, könnte evtl. vielleicht ein bisschen helfen; ist aber wirklich nur ein Schuss ins Blaue, weil ich es hier nicht so nachvollziehen kann.

Buhmann · 14.05.2005, 00:15

nein, das funktioniert nicht.

Ich habe auch schon dinge versucht wie margin-bottom: 10px; oder einfach nur bottom: 10px; , aber das funktioniert genausowenig.

14.05.2005, 08:39

Guck Dir doch mal das hier an

http://css4you.de/wslayout1/index.html

http://css4you.de/wsboxmodell/index.html

http://www.thestyleworks.de/basics/tables.shtml

vielleicht sind da Lösungsansätze, wie gesagt, habe keinen IE hier zu Hause (imho auch ganz gut so, aber das nur am Rande...)

Buhmann · 14.05.2005, 10:48

Ich benutze auch nicht den ie, aber zu viele Leute haben eben nur den und die HP soll überall gut aussehen.

Über das boxenmodell, also mit div's , habe ich auch schon nachgedacht, aber ich würde es lieber bei tabellen belassen, weil es so viel weniger umständlich ist.

14.05.2005, 16:48

*Hallo*

Ich hab dein Fehler noch nicht, ich will auch gern mal wissen was top und left zu bedeuten haben, ich tippe auf margin-top / -left.

Ich probiere paar IE hacks, vielleicht klapps dann, liegt warscheinlich an den höhen und breiten Bezeichungen, manche kann der IE nicht und text-align kann ein IE überhaupt nicht umsetzen auch wenns schade ist, es ist einfach so.

Am besten nur alte CSS1 definitionen benutzen, dann kann garnichts schief gehen

Guck auch mal hier nach http://www.selfhtml.org/ hier steht drin was der IE kann und halt auch nicht kann

*ein Beitrag von*
Karl Loch im Knie

Buhmann · 14.05.2005, 16:58

Ichweiß, dass das da steht. Aber da steht auch, dass der IE bottom unterstütz, aber das tut er je offensichtlich nicht.

14.05.2005, 18:18

*Hallo*

:i dea:

:ide a:

:i dea:

:ide a:

Ich hab einfach ein <div> hinter <table class="main"> gesetzt und hinter dem letzten link wieder geschlossen, anscheinend sieht der IE den von dir gekennzeichneten Bereich nicht als Bereich an, erst durch das setzen eines Kontainers ist es im klar, anders kann ichs mir auch nicht erklären.

Code:

      <table class="main">
<div> 
         <tr>
            <td class="menu" onmouseover="this.style.background='#69AC45'" onmouseout="this.style.background='#89CC65'" onclick=" goto_site('news')">News & Wissenswertes</td>
            <td rowspan="6" class="content">blablalba</td>
         </tr>
         <tr>
            <td class="menu" onmouseover="this.style.background='#69AC45'" onmouseout="this.style.background='#89CC65'" onclick="goto_site('quilts')">Quilts</td>
         </tr>
         <tr>
            <td class="menu" onmouseover="this.style.background='#69AC45'" onmouseout="this.style.background='#89CC65'" onclick="goto_site('buecher')">Bücher</td>
         </tr>
         <tr>
            <td class="menu" onmouseover="this.style.background='#69AC45'" onmouseout="this.style.background='#89CC65'" onclick="goto_site('impressum')">Impressum</td>
         </tr>
</div>
         <tr>
            <td class="spacer" > </td>
         </tr>
         <tr>
            <td class="menu2">Besucher: 5
Rekord: 5 (10. 05. 05)</td>
         </tr>
      </table>

Also, gucks dir an, vielleicht klappts ja auch im IE 3.x und 5.x.

*ein Beitrag von*
Karl Loch im Knie

Buhmann · 14.05.2005, 19:15

das ist aber nichtmehr valide.....

div darf man nicht als direktes unterobjekt von table benutzen

[edit]

ich habe einfach das div um den table positioniert, die positionsangaben der tabelle auf den div übertragen und es funzt perfekt.

Kann geschlossen werden.

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Thema bewerten
Thema bewerten:

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
CSS DIV Border Problem bei IE (wo auch sonst)	FearMyInnerSelf	HTML, Usability und Barrierefreiheit	3	18.07.2008 07:14
div hintergrund wird nur angezeigt wenn border definiert	noskule	HTML, Usability und Barrierefreiheit	0	21.12.2006 15:51
Problem mit border --> unsichtbar machen	kode	HTML, Usability und Barrierefreiheit	3	26.01.2006 20:32
<tr> und border		HTML, Usability und Barrierefreiheit	9	14.11.2005 19:24
Bild als Border		HTML, Usability und Barrierefreiheit	1	18.09.2005 09:53
[Erledigt] [css] [Tabelle will nicht in die Mitte] [IE]		HTML, Usability und Barrierefreiheit	7	07.07.2005 20:19
IE falsche darstellung von border eigenschaften		HTML, Usability und Barrierefreiheit	1	20.06.2005 11:50
1px border		HTML, Usability und Barrierefreiheit	5	14.06.2005 12:15
Bild als border	Dragon26mFR	HTML, Usability und Barrierefreiheit	6	06.06.2005 16:33
[Erledigt] image border abstand		HTML, Usability und Barrierefreiheit	1	22.05.2005 17:00
[Erledigt] border in td (per css)		HTML, Usability und Barrierefreiheit	4	14.02.2005 13:34
Frame - Border	TRW	HTML, Usability und Barrierefreiheit	6	29.01.2005 00:35
Border		HTML, Usability und Barrierefreiheit	2	16.12.2004 17:00
Hilfe da hat wer ne Ecke meiner Tabelle abgehackt. :/		HTML, Usability und Barrierefreiheit	2	07.11.2004 20:18
[Erledigt] Border Frage		HTML, Usability und Barrierefreiheit	2	31.08.2004 20:52


Mister Ad PHP Code Flüsterer Registriert seit: 21.08.2005 Beiträge: 4682 PHP-Kenntnisse: Fortgeschritten

13.05.2005, 22:29
Buhmann Erfahrener Benutzer Registriert seit: 20.01.2005 Beiträge: 1.557 PHP-Kenntnisse: Fortgeschritten	Weiß echt keiner eine lösung? Ich brauch das ziemlich dringend, weil die page n Geburtstagsgeschenk werden soll und ich bin schon am verzweifeln, nichts scheint zu klappen... bump

13.05.2005, 23:07
Gast Beiträge: n/a	Hmmmm, hab' jetzt grade keinen IE zur Verfügung, setz doch mal Code: body { margin:0; padding:0; } ein, könnte evtl. vielleicht ein bisschen helfen; ist aber wirklich nur ein Schuss ins Blaue, weil ich es hier nicht so nachvollziehen kann.

14.05.2005, 00:15
Buhmann Erfahrener Benutzer Registriert seit: 20.01.2005 Beiträge: 1.557 PHP-Kenntnisse: Fortgeschritten	nein, das funktioniert nicht. Ich habe auch schon dinge versucht wie margin-bottom: 10px; oder einfach nur bottom: 10px; , aber das funktioniert genausowenig.

14.05.2005, 08:39
Gast Beiträge: n/a	Guck Dir doch mal das hier an http://css4you.de/wslayout1/index.html http://css4you.de/wsboxmodell/index.html http://www.thestyleworks.de/basics/tables.shtml vielleicht sind da Lösungsansätze, wie gesagt, habe keinen IE hier zu Hause (imho auch ganz gut so, aber das nur am Rande...)

14.05.2005, 10:48
Buhmann Erfahrener Benutzer Registriert seit: 20.01.2005 Beiträge: 1.557 PHP-Kenntnisse: Fortgeschritten	Ich benutze auch nicht den ie, aber zu viele Leute haben eben nur den und die HP soll überall gut aussehen. Über das boxenmodell, also mit div's , habe ich auch schon nachgedacht, aber ich würde es lieber bei tabellen belassen, weil es so viel weniger umständlich ist.

14.05.2005, 16:48
Gast Beiträge: n/a	Hallo Ich hab dein Fehler noch nicht, ich will auch gern mal wissen was top und left zu bedeuten haben, ich tippe auf margin-top / -left. Ich probiere paar IE hacks, vielleicht klapps dann, liegt warscheinlich an den höhen und breiten Bezeichungen, manche kann der IE nicht und text-align kann ein IE überhaupt nicht umsetzen auch wenns schade ist, es ist einfach so. Am besten nur alte CSS1 definitionen benutzen, dann kann garnichts schief gehen Guck auch mal hier nach http://www.selfhtml.org/ hier steht drin was der IE kann und halt auch nicht kann ein Beitrag von Karl Loch im Knie

14.05.2005, 16:58
Buhmann Erfahrener Benutzer Registriert seit: 20.01.2005 Beiträge: 1.557 PHP-Kenntnisse: Fortgeschritten	Ichweiß, dass das da steht. Aber da steht auch, dass der IE bottom unterstütz, aber das tut er je offensichtlich nicht.

14.05.2005, 19:15
Buhmann Erfahrener Benutzer Registriert seit: 20.01.2005 Beiträge: 1.557 PHP-Kenntnisse: Fortgeschritten	das ist aber nichtmehr valide..... div darf man nicht als direktes unterobjekt von table benutzen [edit] ich habe einfach das div um den table positioniert, die positionsangaben der tabelle auf den div übertragen und es funzt perfekt. Kann geschlossen werden.