Andre Grumbach: Probleme mit Firefox

Beitrag lesen

SELF-Forum

Probleme mit Firefox

Andre Grumbach
– Informationen zu den Bewertungsregeln

Hallo zusammen,
ich versuche derzeit eine Webseite zu erstellen, die aus mehreren Divs besteht.
Einige dieser Divs sollen Scrollbar sein (Soweit funktioniert es auch, jedenfalls im IE).

Hierzu baue ich eine Tabelle mit mehreren Zeilen und Zellen auf (Beispiel s.u.).

Nun weiß ich bestimmten Zellen und Zeilen ein Variable Breite/Höhe wie z.B. 70% zu und dem DIV einen Breite/Höhe von 100 bzw. 99 Prozent.
Dies funktioniert im IE auch wunderbar, so das der DIV 100/99% der Celle ausfüllt, jedoch bekomme ich im Firefox ein DIV mit 99/100% der Seite und nicht der Celle.
Kann es sein, das FireFox bei den Prozentangaben immer auf die komplette Seite gehen und nicht auf die Größe des übergeordnten Wertes?

Wenn ja wie kann so etwas umgangen werden?
Ich kann nun natürlich auch für den DIV 70% eintragen, jedoch habe ich dann im IE wieder das Problem das der DIV kleiner angezeigt wird als sie er sein sollte.

Hoffe es hat einer eine Idee bzw. kann mir sagen was ich falsch mache.

Gruß,
Andre

<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>#</title>
</head>

<body>
<div id="Select_a" style="">
      <table id="Select_at" height="70%" width="100%" class="Select">

<tr>
              <td onmouseover="HideDivSelect_Highlight()" onmouseout="HideDivSelect_NoHighlight()" style="" onclick="hideLayer('Select');return false" align="right"><img id="HideDivSelect" src="_imgs/Expand.png" /></td>
          </tr>
          <tr height="95%" width="100%">
              <td style="text-decoration:none;cursor:default;">

<table id="TableList1_tElements" class="Element" border="0" style="width:100%;">
 <tr class="HeaderFooterRow" style="height:10px;">
  <td align="left"><a disabled="disabled" class="Link"><<</a> <a disabled="disabled" class="Link"><</a></td><td></td><td align="center"><a disabled="disabled" class="Link" style="font-weight:bold;">1</a>&nbsp;<a class="Link" href="javascript:__doPostBack('hlNumber','1')">2</a>&nbsp;<a class="Link" href="javascript:__doPostBack('hlNumber','2')">3</a>&nbsp;<a class="Link" href="javascript:__doPostBack('hlNumber','3')">4</a>&nbsp;<a class="Link" href="javascript:__doPostBack('hlNumber','4')">5</a>&nbsp;<a class="Link" href="javascript:__doPostBack('hlNumber','5')">6</a>&nbsp;<a class="Link" href="javascript:__doPostBack('hlNumber','6')">7</a>&nbsp;<a class="Link" href="javascript:__doPostBack('hlNumber','7')">8</a>&nbsp;<a class="Link" href="javascript:__doPostBack('hlNumber','8')">9</a>&nbsp;<a class="Link" href="javascript:__doPostBack('hlNumber','9')">10</a></td><td></td><td align="right"><a class="Link" href="javascript:__doPostBack('hlNext','1')">></a> <a class="Link" href="javascript:__doPostBack('hlEnd','279')">>></a></td>

</tr><tr>
  <td id="TableList1_CellElementTable" class="scroll" colspan="5" style="height:90%;width:100%;"><div style="OVERFLOW: auto; WIDTH: 99%; HEIGHT: 99%"><table border="0" style="height:100%;width:100%;">
   <tr>
    <td class="WhiteColumn" style="height:150px;width:20%;">
     Row1 Cell 1
    </td>
    <td class="BlackColumn" style="height:150px;width:20%;">
     Row1 Cell2
    </td>
    <td class="WhiteColumn" style="height:150px;width:20%;">
     Row1 Cell3
    </td>
    <td class="BlackColumn" style="height:150px;width:20%;">
     Row1 Cell4
    </td>
    <td class="WhiteColumn" style="height:150px;width:20%;">
     Row1 Cell5
    </td>
   </tr>
   <tr>
    <td class="BlackColumn" style="height:150px;width:20%;">
     Row2 Cell1
    </td>
    <td class="WhiteColumn" style="height:150px;width:20%;">
     Row2 Cell2
    </td>
    <td class="BlackColumn" style="height:150px;width:20%;">
     Row2 Cell3
    </td>
    <td class="WhiteColumn" style="height:150px;width:20%;">
     Row2 Cell4
    </td>
    <td class="BlackColumn" style="height:150px;width:20%;">
     Row2 Cell5
    </td>
   </tr><tr>
    <td class="WhiteColumn" style="height:150px;width:20%;">
     Row1 Cell 1
    </td>
    <td class="BlackColumn" style="height:150px;width:20%;">
     Row3 Cell2
    </td>
    <td class="WhiteColumn" style="height:150px;width:20%;">
     Row3 Cell3
    </td>
    <td class="BlackColumn" style="height:150px;width:20%;">
     Row3 Cell4
    </td>
    <td class="WhiteColumn" style="height:150px;width:20%;">
     Row3 Cell5
    </td>
   </tr>
   <tr>
    <td class="BlackColumn" style="height:150px;width:20%;">
     Row4 Cell1
    </td>
    <td class="WhiteColumn" style="height:150px;width:20%;">
     Row4 Cell2
    </td>
    <td class="BlackColumn" style="height:150px;width:20%;">
     Row4 Cell3
    </td>
    <td class="WhiteColumn" style="height:150px;width:20%;">
     Row4 Cell4
    </td>
    <td class="BlackColumn" style="height:150px;width:20%;">
     Row4 Cell5
    </td>
   </tr>
  </table></div></td>

</tr><tr class="HeaderFooterRow" style="height:10px;">
  <td align="left"><a disabled="disabled" class="Link"><<</a> <a disabled="disabled" class="Link"><</a></td><td></td><td align="center"><a disabled="disabled" class="Link" style="font-weight:bold;">1</a>&nbsp;<a class="Link" href="javascript:__doPostBack('hlNumber','1')">2</a>&nbsp;<a class="Link" href="javascript:__doPostBack('hlNumber','2')">3</a>&nbsp;<a class="Link" href="javascript:__doPostBack('hlNumber','3')">4</a>&nbsp;<a class="Link" href="javascript:__doPostBack('hlNumber','4')">5</a>&nbsp;<a class="Link" href="javascript:__doPostBack('hlNumber','5')">6</a>&nbsp;<a class="Link" href="javascript:__doPostBack('hlNumber','6')">7</a>&nbsp;<a class="Link" href="javascript:__doPostBack('hlNumber','7')">8</a>&nbsp;<a class="Link" href="javascript:__doPostBack('hlNumber','8')">9</a>&nbsp;<a class="Link" href="javascript:__doPostBack('hlNumber','9')">10</a></td><td></td><td align="right"><a class="Link" href="javascript:__doPostBack('hlNext','1')">></a> <a class="Link" href="javascript:__doPostBack('hlEnd','279')">>></a></td>

</tr>
</table>

</td>
    </tr>
   </table>
   </div>
   <div id="Select_z">
          <table width="100%" class="Select">
              <tr>

<td onmouseover="ShowDivSelect_Highlight()" onmouseout="ShowDivSelect_NoHighlight()" onclick="showLayer('Select');return false" align="right"><img id="ShowDivSelect" src="_imgs/Collapse.png" /></td>
              </tr>
       </table>
   </div>

</body>

</html>

Beitrag melden
–
Informationen zu den Bewertungsregeln