DominikAT: IE Tableproblem

SELF-Forum

IE Tableproblem

DominikAT Homepage des Autors
– Informationen zu den Bewertungsregeln

Hallo liebes Forum.. bisher hab ich mir eigentlich immer selbst aus der Patsche helfen können, aber ich scheitere gerade am lieben IE...

Ich hab eine kleine Page gebaut, basierend auf Tables. Opera und Fox stellen das ganze auch richtig dar, aber im IE werden drei der Tables schlicht falsch dargestellt.
Ich hab mir schon den Code 10x durchgelesen, aber komm nicht dahinter...
Wahrscheinlich habe ich nur iwo vergessen einen Tag zu schließen, und überlese das ganze dauernd...

die page steht als Preview online: http://preview.xcross.at/planetenweg/

<< Ich weis, kein validate... aber es müssen unbedingt im IE farbige Scrollbars sein... ( :-( ) >>

<b>und hier die sources: </b>

php/html:

  
<head>  
<meta content="text/html; charset=iso-8859-1" http-equiv="Content-Type" />  
<link href="style.css" rel="stylesheet" type="text/css" />  
  
<title>AllWissen - Kinderplanetenweg Lichtenberg</title>  
</head>  
<body>  
<div align="center">  
<table id="maintable" cellpadding="0" cellspacing="0">  
	<tr>  
		<td id="logo" rowspan="2"></td>  
		<td id="top">  
			<div id="top_menu">  
				<a class="tm" href="index.php?site=home">Startseite</a>  
				<a class="tm" href="index.php?site=links">Links</a>  
				<a class="tm" href="index.php?site=impressum">Impressum</a>  
				<a class="tm" href="index.php?site=kontakt">Kontakt</a>  
			</div>  
		</td>  
		<td id="logo_right" rowspan="4"></td>  
	</tr>  
	<tr>  
		<td id="content" rowspan="2">  
			<div id="content_div">  
				<?  
				if($_GET[site]==""){  
					include("content/home.htm");  
				}else{  
					@include("content/" . $_GET[site] . ".htm");  
				}  
				?>  
			</div>  
		</td>  
	</tr>  
	<tr>  
		<td id="wetter">  
			<div id="wetter_div">wetter-plugin</div>  
		</td>  
	</tr>  
	<tr>  
		<td id="menu_td" colspan="2">  
			<table id="menu" cellpadding="0" cellspacing="0">  
				<tr>  
					<td id="menu_left"></td>  
					<td id="menu_planetenweg"><a href="index.php?site=planetenweg"><img src="img/m_planetenweg.jpg"</a></td>  
					<td id="menu_planeten"><a href="index.php?site=planeten"><img src="img/m_planeten.jpg"</a></td>  
					<td id="menu_anfahrt"><a href="index.php?site=anfahrt"><img src="img/m_anfahrt.jpg"</a></td>  
					<td id="menu_right"></td>  
				</tr>  
			</table>  
		</td>  
	</tr>  
</table>  
	<p class="line">.........................................................................................................................................................................................................</p>  
	<div id="footer_div">		<table id="footer" cellpadding="0" cellspacing="0">  
			<tr>  
			<td id="f_left"><a class="ft" href="http://www.xcross.at/design" target="_blank">designed by design.xcross</a><span style="color: #dadada;"> in Kooperation mit </span><a target="_blank" class="ft" href="http://www.hblalentia.at/">HBLA Lentia</a></td>  
			<td id="f_right"><a class= "ft" href="http://www.lichtenberg.ooe.gv.at/system/web/default.aspx" target="_blank">&copy; 2009 Gemeinde Lichtenberg</a></td></tr>  
		</table>	</div>  
</div>  
</body>  
</html>

CSS:

  
/*---------------------------------------------  
Standards  
---------------------------------------------*/  
body{  
background-color: white;  
background-image: url(img/bg.jpg);  
scrollbar-arrow-color: #800023;  
scrollbarBaseColor: #fbfbfb;  
scrollbar-track-color: #fbfbfb;  
scrollbar-face-color: #fbfbfb;  
scrollbar-highlight-color: #fbfbfb;  
scrollbar-3dlight-color: #fbfbfb;  
scrollbar-darkshadow-color: #fbfbfb;  
scrollbar-shadow-color: #fbfbfb;  
}  
  
table,img,td,div,form,button,select,input,textarea,h4,h5,h6,cite,quote,u,i {  
  font-family: Verdana;  
  font-size: 10px;  
  line-height: 130%;  
  color: #6a6b6c;  
  margin: 0px;  
  padding: 0px;  
  border: none;  
}  
  
p,a{  
  font-family: Verdana;  
  font-size: 10px;  
  line-height: 130%;  
  color: #6a6b6c;  
  text-align: justify;  
}  
  
a:link,a:visited,a:active {  
  color: #6db63d;  
  font-weight: bold;  
  text-decoration: none;  
}  
a:hover {  
  color: #e21d24;  
  text-decoration: none;  
  font-weight: bold;  
}  
  
  
/*---------------------------------------------  
grundaufbau  
---------------------------------------------*/  
  
#maintable{  
	width: 900px;  
	height: 556px;  
}  
  
#logo{  
	width: 250px;  
	height: 270px;  
	background-image: url(img/logo.jpg);  
	background-color: red;  
}  
  
#top{  
	width: 570px;  
	height: 41px;  
	background-image: url(img/top.jpg);  
	text-align: right;  
	vertical-align: top;  
	background-color: blue;  
}  
  
#logo_right{  
	width: 80px;	  
	height: 556px;  
	background-image: url(img/logo_right.jpg);  
	background-color: lightblue;  
}  
  
#content{  
	background-color: white;  
	overflow: auto;  
	height: 389px;  
	width:570px;  
	vertical-align: top;  
	text-align: left;  
	background-color: black;  
}  
  
#content_div{  
	background: transparent;  
	overflow: auto;  
	height: 389px;  
	width:570px;  
	vertical-align: top;  
	text-align: left;  
}  
  
#wetter{  
	height: 160px;	width: 250px;  
	background-image: url(img/wetter_bg.jpg);  
	background-color: gray;  
  
}  
  
#wetter_div{  
	background: transparent;  
	overflow: none;  
	margin-left: 56px;  
	margin-right: 22px;  
}  
  
#menu_td{  
	height: 126px;	  
	width: 820px;  
	background-color: orange;  
}  
#footer{  
	width: 800px;  
	text-align: center;  
	background-color: green;  
}  
  
#f_left{  
	width: 65%;  
	text-align: left;	padding-top: -5;  
}  
  
#f_right{  
	width: 35%;  
	text-align: right;	padding-top: -5;  
}#footer_div{	margin-top: -10; }  
  
/*---------------------------------------------  
menu  
---------------------------------------------*/  
#menu{  
	height: 100%;  
	width: 100%;  
}  
  
#menu_left{  
	width: 56px;  
	background: url(img/m_left.jpg);  
}  
  
#menu_planetenweg{  
	width: 194px;  
}  
  
#menu_planeten{  
	width: 157px;  
}  
  
#menu_anfahrt{  
	width: 177px;  
}  
  
#menu_right{  
	width: 236px;  
	background-image: url(img/m_right.jpg);  
}  
  
/*---------------------------------------------  
topmenu  
---------------------------------------------*/  
#top_menu{  
	background: transparent;  
	text-align: right;  
	padding-right: 40px;  
	padding-top: 0px;  
	font-size: 11px;  
	font-weight: bolder;  
	color: #dadada;  
}  
a.tm:link,a.tm:visited,a.tm:active {  
  color: #dadada;  
  text-decoration: none;  
  padding-left: 5px;  
  padding-right: 5px;  
}  
a.tm:hover {  
  color: darkgray;  
  text-decoration: none;  
}  
/*---------------------------------------------  
footer  
---------------------------------------------*/  
  
a.ft:link,a.ft:visited,a.ft:active {  
  color: #dadada;  text-decoration: none;  
 }  
  
a.ft:hover {  
	color: darkgray;  text-decoration: none;  
}  
  
 /*---------------------------------------------  
 site_links  
 ---------------------------------------------*/  
 a.li:link,a.li:visited,a.li:active {  
	color: darkgray;  text-decoration: none;  
}  
  
a.li:hover {  
	color: #e21d24;  text-decoration: none;  
}  
  
/*---------------------------------------------  
content style  
---------------------------------------------*/  
  
h1{  
	padding-left: 5px;  
	font-size: 16px;  
	font-weight: bold;  
	color: #e21d24;  
	text-decoration: none;  
}h2{	padding-left: 5px;	font-size: 12px;	font-weight: bold;	color: #e21d24;	text-decoration: none;	line-height: 130%;	}  
  
.hl{  
	color: #e21d24;  
}  
  
.line{  
	color: #dadada;  
	text-align:center;  
}

währ fein, wenn mir da einer Helfen könnte.

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. IE Tableproblem

    Mirco
    – Informationen zu den Bewertungsregeln

    Hi,
    ich empfehle dir mal unter Fire-Fox den HTML-Validator zu installieren.
    (https://addons.mozilla.org/de/firefox/search?q=html+validator&cat=all)

    Da hast Du dann unten rechts im Browser ein kleines Symbol, welches Dir anzeigt, ob die aktuell geladene Seite Fehlerfrei ist.
    Wenn ich mir Deine Seite reinlade spuckt der schonmal 3 Fehler aus.

    Ist also recht Hilfreich :)

    CU

    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

  2. IE Tableproblem

    DominikAT
    – Informationen zu den Bewertungsregeln

    Gutes Plugin - Dankeschön :)
    hab gleich ein paar fehler entdeckt, und ausgebessert...

    Leider löst es mein Problem mit dem IE noch nicht:
     die Aktuelle index.php liegt als html unter
    http://preview.xcross.at/planetenweg/source.html
     die url zur CSS:
    http://preview.xcross.at/planetenweg/style.css

    lg
    Dominik

    Beitrag melden
    –
    Informationen zu den Bewertungsregeln

    1. IE Tableproblem

      Beat Homepage des Autors
      – Informationen zu den Bewertungsregeln

      hab gleich ein paar fehler entdeckt, und ausgebessert...

      Leider löst es mein Problem mit dem IE noch nicht:
      die Aktuelle index.php liegt als html unter
      http://preview.xcross.at/planetenweg/source.html

      Fein und jetzt gibst du deinem Dokument bitte noch eine validierbare Doctype, vorzugsweise in der Variante strict.

      http://www.w3.org/QA/2002/04/valid-dtd-list.html

      mfg Beat

      --
      ><o(((°>           ><o(((°>
         <°)))o><                     ><o(((°>o
      Der Valigator leibt diese Fische
      Beitrag melden
      –
      Informationen zu den Bewertungsregeln

      1. IE Tableproblem

        DominikAT
        – Informationen zu den Bewertungsregeln

        is aus dem einfachen grund, der eingefärbten scrollbars im IE nicht drin...

        was mein problem aber auch nicht ändert: ein Tableproblem im IE

        Beitrag melden
        –
        Informationen zu den Bewertungsregeln

        1. IE Tableproblem

          Gernot Back
          – Informationen zu den Bewertungsregeln

          Hallo DominikAT,

          is aus dem einfachen grund, der eingefärbten scrollbars im IE nicht drin...

          Was hindert dich daran, diese Eigenschaften im standardkonformen Modus dem HTML- statt dem BODY-Element zuzuweisen?
          http://de.selfhtml.org/css/eigenschaften/anzeigefenster.htm#scrollbar
          http://www.css4you.de/ieproperty.html

          Gruß Gernot

          --
          super me
          Beitrag melden
          –
          Informationen zu den Bewertungsregeln

          1. IE Tableproblem^solved

            DominikAT
            – Informationen zu den Bewertungsregeln

            Hallo DominikAT,

            »» is aus dem einfachen grund, der eingefärbten scrollbars im IE nicht drin...

            Was hindert dich daran, diese Eigenschaften im standardkonformen Modus dem HTML- statt dem BODY-Element zuzuweisen?
            http://de.selfhtml.org/css/eigenschaften/anzeigefenster.htm#scrollbar
            http://www.css4you.de/ieproperty.html

            Gruß Gernot

            nichts, nur das es mit meinem Problem nichts zu tun hat...

            Das Problem habe ich selbst gelöst.

            das muss eine Krankheit hier sein - anstatt am problem zu helfen, erst einmal 10 andere dinge, die damit nix zu tun haben suchen. ist mir schon bei einigen beiträgen hier aufgefallen.
            nach dem motto "erst mal alles was er falsch gemacht hat suchen, bevor man mal bei nem problem hilft" - schade eg.

            <!------------->

            Mein Problem war: IE interpretiert die Table's falsch
            Das Problem dabei: die konstellation der rowspans und colspans verträgt sich nicht mit IE

            weil sich

            <table>  
	<tr>  
		<td rowspan="2"></td>  
		<td></td>  
		<td></td>  
	</tr>  
	<tr>  
		<td rowspan="2"></td>  
		<td></td>  
	</tr>  
	<tr>  
		<td></td>  
		<td></td>  
		<td></td>  
	</tr>  
</table>

            im ie genauso verhält wie

            <table>  
	<tr>  
		<td rowspan="2"></td>  
		<td rowspan="2"></td>  
		<td></td>  
	</tr>  
	<tr>  
		<td></td>  
	</tr>  
	<tr>  
		<td></td>  
		<td></td>  
		<td></td>  
	</tr>  
</table>

            Auch wenn ich "Mirco" überaus dankbar für den Tipp mit dem HTML-Validator für FFox bin.

            Aber bin im nachhinein draufgekommen, das Opera im prinzip die selbe funktion schon eingebaut hat.

            Beitrag melden
            –
            Informationen zu den Bewertungsregeln

            1. IE Tableproblem^solved

              Gernot Back
              – Informationen zu den Bewertungsregeln

              Hallo DominikAT,

              »» Was hindert dich daran, diese Eigenschaften im standardkonformen Modus dem HTML- statt dem BODY-Element zuzuweisen?
              »» http://de.selfhtml.org/css/eigenschaften/anzeigefenster.htm#scrollbar
              »» http://www.css4you.de/ieproperty.html

              nichts, nur das es mit meinem Problem nichts zu tun hat...

              Du willst damit also sagen, du hättest das IE-Problem auch im standardkonformen Modus gehabt?

              Das ist zwar eher die Ausnahme, kann insbesondere bei Tabellenlayout jedoch durchaus immer noch sein, wie ich an meiner vor Jahren für den IE7 gebauten Testseite nun erstmals auch im IE8 sehe:
              http://sprachlernspiele.de/engel/matroschka.html

              Das alles ist übrigens dennoch kein Grund, hilfsbereite SELFHTML-Forumsteilnehmer anzupflaumen!

              Gruß Gernot

              --
              super me
              Beitrag melden
              –
              Informationen zu den Bewertungsregeln

  3. IE Tableproblem

    Der Martin
    – Informationen zu den Bewertungsregeln

    Hallo,

    << Ich weis, kein validate... aber es müssen unbedingt im IE farbige Scrollbars sein... ( :-( ) >>

    ... die mein IE dank anderslautender Anweisungen im User-Stylesheet trotzdem nicht farbig darstellen würde. :-P

    <head>

    Kein DOCTPYE? Schonmal ganz schlecht. Lass den Browser raten, schick ihn in den Quirksmode ...

    <meta content="text/html; charset=iso-8859-1" http-equiv="Content-Type" />
    <link href="style.css" rel="stylesheet" type="text/css" />

    Ah, du hast dich also für XHTML entschieden? Warum dann kein xmlns-Attribut im html-Element?

      	<div id="top\_menu">  
  		<a class="tm" href="index.php?site=home">Startseite</a>  
  		<a class="tm" href="index.php?site=links">Links</a>  
  		<a class="tm" href="index.php?site=impressum">Impressum</a>  
  		<a class="tm" href="index.php?site=kontakt">Kontakt</a>  
  	</div>

    Dieses Menü möchte nur zu gern eine Liste anstatt eines nichtssagenden div-Containers sein.

      		<?  
  		if($\_GET[site]==""){  
  			include("content/home.htm");  
  		}else{  
  			@include("content/" . $\_GET[site] . ".htm");  
  		}  
  		?>

    Autschn. Hast du eine Konstante namens site definiert? Wenn nicht, wirst du hier zumindest eine Notice kassieren. Abgesehen davon ist die Verwendung der Short Tags problematisch; die Wahrscheinlichkeit, dass der GET-Parameter 'site' als Leerstring übergeben wird, ist verschwindend gering; ihn ungeprüft in einer include-Anweisung zu verwenden, ist Leichtsinn; Fehlermeldungen mit dem '@' zu unterdrücken heißt, die Augen zu verschließen anstatt Fehler wahrzunehmen und zu beseitigen.

    <p class="line">.........................................................................................................................................................................................................</p>

    Was ist das? Möchte das nicht eher ein border mit border-style: dotted sein?

    body{
    scrollbar-arrow-color: #800023;
    scrollbarBaseColor: #fbfbfb;
    scrollbar-track-color: #fbfbfb;
    scrollbar-face-color: #fbfbfb;
    scrollbar-highlight-color: #fbfbfb;
    scrollbar-3dlight-color: #fbfbfb;
    scrollbar-darkshadow-color: #fbfbfb;
    scrollbar-shadow-color: #fbfbfb;
    }

    Siehe oben.

    a:link,a:visited,a:active {
      color: #6db63d;
      font-weight: bold;
      text-decoration: none;
    }

    Du möchtest die clientseitige Markierung besuchter Links verhindern? Da sind manche User, die diese Information für sinnvoll halten, aber gar nicht begeistert.

    #f_left{
    width: 65%;
    text-align: left; padding-top: -5;
    }

    Da fehlt eine Einheit: 5 Stöckchen oder 5 Zoll?

    #f_right{
    width: 35%;
    text-align: right; padding-top: -5;
    }#footer_div{ margin-top: -10; }

    Dito.

    Ich persönlich würde mir noch wünschen, dass du Farbnamen zugunsten der informativeren RGB-Darstellung aufgeben würdest, aber das ist meine ganz eigene Meinung.

    So long,
     Martin

    --
    Lehrer:  Wieviel ist die Hälfte von 8?
    Schüler: Kommt drauf an. Waagrecht 0 und senkrecht 3.
    Beitrag melden
    –
    Informationen zu den Bewertungsregeln