nocheinPoet: float bug im Opera?

Beitrag lesen

SELF-Forum

float bug im Opera?

nocheinPoet
– Informationen zu den Bewertungsregeln

Hallo liebe Gemeinde,

ich habe da ein Problem mit dem  Opera und auch dem IE, das mit dem Opera ist aber nerviger.

Der Opera reißt das Table DIV mit doppelter Breite auf, im FF und IE liegt das rote X direkt neben dem table DIV.

Nehme ich das "float:left;" aus der class ".table .header" sieht es besser aus, aber ich bekomme unten ein scrollbar im Opera, auch nicht toll, außerdem brauche ich das float eigentlich.

Gebe ich der class ".table" -> "width: 100px;" geht es auch besser, aber dafür bricht der IE das zweite DIV im zweiten Header um.

Habe echt schon eine Menge versucht, mir ist das Verhalten vom Opera nicht klar, warum reißt er das DIV so auf, als ob beide Header nebeneinander liegen würden?

Ich finde bisher nur Lösungen, die mich dann recht einschränken, und nur für den Opera so etwas zu machen, geht mir recht gegen den Strich, bisher dachte ich, der Opera ist dem FF recht nahe und nun wundert mich das doch sehr.

hier mal der Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
 <title></title>

<style>

BODY {background: url(../images/Pixelraster/GIF/pixelraster.gif) no-repeat;  margin-top: 10px;  margin-left: 10px; font-family: Arial, Helvetica, sans-serif; font-size: 11px;    }

.scrollpane /*position: relative;*/
  {
   width: 600px; height: 120px;  overflow: auto; float: left; background-color: #ADD8E6;
  }
/*   width: 600px; height: 120px; position: relative; overflow: auto; background-color: #ADD8E6; */

.table /*width: 400px;*/
  {
   background-color: #FFDEAD; float:left; font-family: Arial, Helvetica, sans-serif; font-size: 11px;

}

.table .header /*position: relative;float: none;display: block;*/
  {
   background-color: #CDFFAC; float: left; clear: both;
  }

.table .header DIV /*position: relative;*/
  {
   background-color: #CDFFAC; float: left;  border: 1px solid;
   overflow: hidden;
  }

.table .body /*position: relative;*/
  {
   background-color: #ACF6FF; float: left; clear: both;
  }

.table .panel /**/
  {
   background-color: #E6D7AE; float: left; overflow: hidden;
  }

.table .body .panel .row DIV /*position: relative;*/
  {
   background-color: #CDFFAC; float: left;  border: 1px solid;
  }

.row { background-color: #FF6347; }

.col_01 {width: 30px;}
  .col_02 {width: 30px;}

</style>

</head>

<body>

<!-- SCCROLLPANE -->
 <div class="scrollpane">

<!-- TABLE -->
  <div class="table">

<!-- HEADER -->
   <div class="header">

<div class="col_01" style="">col_01</div>
     <div class="col_02" style="">col_02</div>

</div>

<div class="header">

<div class="col_01" style="">col_01</div>
     <div class="col_02" style="">col_02</div>

</div>

</div>
  <!-- END TABLE -->

<div style="background-color: Red; float: left; width: 50px;">x</div>

</div>
 <!-- SCCROLLPANE -->

</body>
</html>

Beitrag melden
–
Informationen zu den Bewertungsregeln