Dominik: IE stellt Seite nach einfügen von Tabelle nicht mehr richtig da.

Guten Morgen zusammen,

Ich habe da mal ein kleines Problem. Ich gestalte gerade eine Seite neu mit CSS. IE stellt die Seiten auch richtig da so lange keine Tabelle verwendet wird. Erst bei einer Tabelle ignoriert der IE die CSS Definitionen.
Und zwar wird die Textbox die eigentlich rechts positioniert wird dann mittig dargestellt, die Texteigenschaften die im CSS definiert wird nicht beachtet.

Warum? Wie kann ich Abhilfe schaffen?

Vielen Dank für eure Hilfe

Grüsse

Dominik

<html>  
<head>  
  
<style type="text/css" media="screen">  
  
  
 body  
 {  
 margin: 0;  
 padding: 0;  
 font: 85% arial, hevetica, sans-serif;  
 text-align: center;  
 background-color: #800000;  
 }  
  
 #container  
 {  
 margin: 4px auto;  
 width: 65%;  
 text-align: left;  
 background-color: black;  
  
 }  
  
 #boxcon  
 {  
 display: inline;  
 float: right;  
 background-color: black;  
 }  
  
 #header  
 {  
 background-color: black;  
 height: 91px;  
 padding: 20px;  
 }  
  
 #mainnav  
 {  
 background-color: black;  
 height: 25px;  
 width: 100%;  
 }  
  
 #mainnav ul  
 {  
 margin: 0px;  
 padding: 0px;  
 }  
  
 #mainnav li  
 {  
 float: left;  
 list-style-type: none;  
 white-space: nowrap;  
 }  
  
 #mainnav li a  
 {  
 margin: 0px;  
 padding: 1px 20px;  
 font-weight: bold;  
 color: #FFFFFF;  
 }  
  
 #menu  
 {  
 margin-top: 10px;  
 width: 170px;  
 background-color: #595959;  
 margin-right: 10px;  
 padding: 10px;  
 }  
  
 #contents  
 {  
 margin-top: 10px;  
 margin-right: 210px;  
 margin-left: 10px;  
 padding: 10px;  
 background-color: #595959;  
 text-color: white;  
 }  
  
 #footer  
 {  
 clear: both;  
 background-color: black;  
 text-align: center;  
 padding: 2px;  
 }  
  
 A:LINK  
 {  
 color : 800000;  
 text-decoration:none;  
 font-size : 12;  
 }  
  
 A:HOVER  
 {  
 color : 800000;  
 text-decoration:underline;  
 font-size : 12;  
 }  
  
 A:VISITED  
 {  
 color : #FFFFFF;  
 text-decoration:none;  
 font-size : 12;  
 }  
  
 A:LINK.link  
 {  
 color : #FFFFFF;  
 text-decoration:none;  
 font-size : 12;  
 }  
  
 A:HOVER.link  
 {  
 color : #FFFFFF;  
 text-decoration:underline;  
 font-size : 12;  
 }  
  
 A:VISITED.link  
 {  
 color : 800000;  
 text-decoration:none;  
 font-size : 12;  
 }  
  
 h2  
 {  
 font-family : Arial, Helvetica, sans-serif;  
 font-size : 18pt;  
 color : white;  
 }  
  
 h3  
 {  
 font-family : Arial, Helvetica, sans-serif;  
 font-size : 14pt;  
 color : white;  
 }  
  
 h10  
 {  
 font-family : Arial, Helvetica, sans-serif;  
 font-size : 12;  
 color : white;  
 }  
  
 h99  
 {  
 font-size:7pt;  
 color: white;  
 }  
  
  
  
  
</style>  
</head>  
<body>  
  
<div id="container">  
 <div id="header">  
 <div align="center">  
 <img src="Logo.jpg" border="0">  
 </div>  
 </div>  
  
 <div id="mainnav">  
 <li><a href="1.html"><b> Text </b></a></li>  
 <li><a href="2.html"><b>Text 2 </b></a></li>  
 <li><a href="3.html"><b>Text 3</b></a></li>  
 <li><a href="4.html"><b>Text 4</b></a></li>  
 </div>  
  
 <div id="boxcon">  
 <div id="menu">  
 <H10> Textbox mit Inhalt</H10>  
 </div>  
 </div>  
  
  
 <div id="contents">  
 <div align="center">  
 <H10><b>Überschrift:</b></h10>  
 </div>  
 <br><br>  
 <table border="0" cellpadding="1" cellspacing="0" width="100%">  
        <tr>  
 <td align="center" >Inhalt 1</td>  
        <td > Inhalt 2</td>  
 <td align="center" >Inhalt 3</td>  
        <td> Inhalt 4 </td>  
        </tr>  
  
  
  <tr>  
        <td align="center" > &#160;</td>  
 <td align="center" > &#160;</td>  
        <td align="center" > &#160;</td>  
        <td align="center" > &#160;</td>  
 </tr>  
 <tr>  
        <td align="center" > &#160;</td>  
 <td align="center" > &#160;</td>  
        <td align="center" > &#160;</td>  
        <td align="center" > &#160;</td>  
 </tr>  
 </table>  
  
 </div>  
  
  
 <div id="footer"><h99>  
 Hier Steht text  
 </h99></div>  
</div>  
</body>  
</html>
  1. Ich möchte dir empfehlen, deine HTML Datei zu validieren.
    Falls sie sich als nicht validierbar herausstellt, liegt das an der fehlenden Doctype Deklaration.

    http://de.selfhtml.org/html/allgemein/grundgeruest.htm

    mfg Beat

    --
    Woran ich arbeite:
    X-Torah
    ><o(((°>       ><o(((°>
       <°)))o><                      ><o(((°>o
    1. Ich möchte dir empfehlen, deine HTML Datei zu validieren.
      Falls sie sich als nicht validierbar herausstellt, liegt das an der fehlenden Doctype Deklaration.

      http://de.selfhtml.org/html/allgemein/grundgeruest.htm

      mfg Beat

      Hallo

      Habe nun meine CSS und meine Html Datei validiert. Habe nun auch die beiden Validierung bestanden.

      Das Problem besteht leider immer noch

      HILFE

      Grüsse

      1. Wenn du float beim IE einsetzt musst du deinen Elementen eine feste Breite geben. das heißt #boxcon #contents brauchen einen width-Wert, der zusammen in den width-Wert deines #containers passt.

        Beispiel:

          
        #boxcon {  
          width:180px;  
          float:right;  
          ...  
        }  
        #contents {  
          width:400px;  
          ...  
        }  
        #container {  
          width:600px;  
        }  
        
        

        Dann müssten die beiden divs nebeneinander in den container passen...

        1. Hallo

          Habe nun den 3 Elementen eine feste Breite gegeben. Leider habe ich den noch kein Erfolg.
          Was anzumerken ist das es erst Probleme gibt sobald ich eine Tabelle in den #contents einfüge.Vorher schaut es gut aus.

          Grüsse

  2. Weiß den niemand weiter???