nicht angemeldet
Hallo,
folgendes Problem: ich habe einen DIV-container, der left gefloatet ist. Ein weiterer grenzt rechts daran an. Nun befindet sich ein TABLE-Element in diesem zweiten DIV mit einer Breite von 100%. Es nimmt den kompletten Raum rechts des ersten DIVs ein. Firefox findet das super, der IE setzt das zweite DIV allerdings unter das Erste. Jedoch nur, wenn:
1. mindestens ein TABLE-Element MIT TRs und TDs enthalten ist
2. die Breite größer ist als 99%
HTML Code:
<body>
<div id="main">
<div id="content_frame">
<div id="navi">
<img src="img/header.jpg" alt="header" border="0" />
</div>
<div id="content">
<table cellspacing="1" cellpadding="0" class="main_table">
<colgroup>
<col width="30%">
<col width="70%">
</colgroup>
<tr>
<td class="heading" colspan="2">Benutzeraccount</td>
</tr>
<tr>
<td>Benutzername:</td>
<td><input type="text" name="username" /></td>
</tr>
</table>
</div>
</div>
</div>
</body>
CSS:
/* general */
* {
margin:0;
padding:0;
border:0;
}
option {
padding-left:0.4em;
}
input {
border:1px #c4c4c4 solid;
padding:2px;
}
html {
height:100%;
}
body {
min-height:100.01%;
font-size:100.01%;
position:relative;
color:#666;
background:#fff;
text-align:left;
font-family:tahoma;
font-size:12px;
z-index:0;
}
/* Main */
#main {
width:100%;
}
#content_frame {
width:100%;
}
#content {
margin-left:215px;
margin-right:15px;
padding-top:4px;
}
/* Content */
.main_table {
background-color:#c4c4c4;
width:100%;
margin-top:16px;
}
.main_table td {
background-color:#f5f5f5;
height:26px;
vertical-align:middle;
padding-left:2px;
padding-right:2px;
}
.heading {
font-size:14px;
font-weight:bold;
background:url("../img/verlauf_high.jpg") bottom;
}