✔ 2 Spalten (eine fix, eine var)

Status
Nicht offen für weitere Antworten.
D

damike

Grünschnabel
Hallo,

ich habe ein Layout gebastellt, bzw bin dabei und es klappt bei mir im Firefox und im Opera.
Nur im IE, da rutscht mir die der DIV mit der ID "middle" immer unter den bereich "left".
Woran kann das liegen ?

Code: 
<html>
<head>
<title>test</title>
<style type="text/css">
<!--
body {
margin:0px;
padding:0px;
}

#main1 {
margin:0px;
padding:0px;
left repeat-y;
}

#main2 {
margin:0px;
padding:0px;
repeat-y;
}

#left {
float:left;
width:180px;
margin:0px;
padding:10px;
text-align: left;
background-color:#CCCCCC;
}

#middle {
margin:0px 0px 0px 200px;
padding:10px;
text-align: center;
background-color:#333333;
}

#title {
height:140px;
padding:5px;
border:none;
text-align: center;
background-color:#111111;
}

#clear {
clear:both;
height:1px;
font-size:1px;
border:0px none;
margin:0px;
padding:0px;
background:transparent;
}

//-->
</style>
</head>

<body>
<div id="title">
 testimg
</div>
<div id="main1" style="width:100%">
<div id="main2" style="width:100%">
 <div id="left">
  <table cellpadding="0" cellspacing="0" style="width:180px">
   <tr>
    <td width="180" align="left" valign="top">
     test menu
    </td>
    <td width="10">&nbsp;</td>
   </tr>
  </table>
  <br />
 </div>
 <div id="middle">
 <table cellpadding="4" cellspacing="1" border="0" style="width:100%">
 <tr>
  <td align="left">
  test guck
  <div align="right">test guck 2</div>
  </td>
  </tr>
  </table>
  <br />
  <table cellpadding="10" cellspacing="1" border="0" align="center">
   <tr>
    <td class="tablea">
	 test
	</td>
   </tr>
  </table>
  <br />
 </td>
</tr>
</table>
</div>
<div id="clear">&nbsp;</div>
</div>
</div>
</body>
</html>

Danke schonmal und Gruß
 
Hier der überarbeitete Quellcode:

Code: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
  "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">
<title>test</title>
<style type="text/css">
<!--
* {
margin:0px;
padding:0px;
}

#left {
float:left;
width:180px;
margin-right:0px !important; /* Für moderne Browser */
margin-right:-3px; /* Für IE */
padding:10px;
text-align: left;
background-color:#CCCCCC;
}

#middle {
margin:0px 0px 0px 200px !important; /* Für moderne Browser */
margin:0px 0px 0px 197px; /* Für IE */
padding:10px;
text-align: center;
background-color:#333333;
height: auto !important; /* Für moderne Browser */
height: 1%; /* Für IE */
}

#title {
height:140px;
padding:5px;
border:none;
text-align: center;
background-color:#111111;
}

#clear {
clear:left;
height:1px;
font-size:1px;
border:none;
background:transparent;
}
-->
</style>
</head>

<body>
<div id="title">
 testimg
</div>
<div id="main1" style="width:100%">
<div id="main2" style="width:100%">
 <div id="left">
  <table cellpadding="0" cellspacing="0" style="width:180px">
   <tr>
    <td width="180" align="left" valign="top">
     test menu
    </td>
    <td width="10">&nbsp;</td>
   </tr>
  </table>
 </div>
 <div id="middle">
 <table cellpadding="4" cellspacing="1" border="0" style="width:100%;">
 <tr>
  <td align="left">
  test guck
  <div align="right">test guck 2</div>
  </td>
  </tr>
  </table>
  <table cellpadding="10" cellspacing="1" border="0" align="center">
   <tr>
    <td class="tablea">
         test
        </td>
   </tr>
  </table>
 </td>
</tr>
</table>
</div>
<div id="clear">&nbsp;</div>
</div>
</div>
</body>
</html>
 
Status
Nicht offen für weitere Antworten.

Neue Beiträge

Zurück