Einzelnen Beitrag anzeigen
  #1 (permalink)  
Alt 17.10.2008, 14:32
Firzen Firzen ist offline
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 17.10.2008
Beiträge: 3
Firzen befindet sich auf einem aufstrebenden Ast
Unglücklich Tabellenfelder mit komischen overflow-Verhalten

Servus,

ich habe hier eine Tabelle mit Werten aus einer MySQL-Tabelle.
Die Spaltenheader (ths) enthalten eine kleine Tabelle mit zwei Bildern (zum Sortieren) und daneben den Titel der Spalte.
Für die ths wurde kein overflow-Verhalten angegeben. Dennoch verhalten sie sich wie mit overflow:visible. Zumindest im Firefox...

Ich habe mal zwei Screens hochgeladen, damit man sich das Ganze besser vorstellen kann.
Darstellung im Firefox 3
Darstellung im Internet Explorer 7

Zur Information noch:
Das ist erst so passiert, als ich den Inhalt des th mit <nobr> umschlossen habe. Vorher wurde der Text nach der kleinen Table mit den Pfeilen umgebrochen was ich aber nicht möchte.

So sieht ein th-Feld aus im Quellcode:
HTML-Code:
<th>
 <nobr>
  <table align="left" class="sortArrows" cellpadding="0" cellspacing="0">
   <tr>
    <td style="vertical-align:bottom;">
     <a href="index.php?module=4&amp;action=view&amp;type=users&amp;sort=id&amp;order=ASC">
      <img src="img/arr_up_gray.gif" alt="asc" width="9" height="6" onMouseOver="this.src='img/arr_up_black.gif';" onMouseOut="this.src='img/arr_up_gray.gif';">
     </a>
    </td>
   </tr>
   <tr>
    <td style="vertical-align:top;">
     <a href="index.php?module=4&amp;action=view&amp;type=users&amp;sort=id&amp;order=DESC">
      <img src="img/arr_down_gray.gif" alt="asc" width="9" height="6" onMouseOver="this.src='img/arr_down_black.gif';" onMouseOut="this.src='img/arr_down_gray.gif';">
     </a>
    </td>
   </tr>
  </table>
  &nbsp;id
 </nobr>
</th>
Man bemerke auch die Darstellung des linken Tabellenborders, die beim FF fehlt, beim IE jedoch da ist...
*vom FF enttäuscht ist*
Die ganze Tabelle ist übrigens in einem div mit overflow:auto...

EDIT:
Was ich vielleicht auch noch erwähnen sollte, ist, dass die kleinen Pfeilbilder mit display:block; ausgestattet sind.

Geändert von Firzen (17.10.2008 um 14:35 Uhr)
Mit Zitat antworten
Sponsored Links