2009-03-03 2 views
0

Ich entwickle ein wiederverwendbares ASP.net Server-Steuerelement, das in IE 6+, FF 2+ und Safari sowohl Quirks und Standards-Modus arbeiten muss.Resuable Asp.net Server Kontrolle mit Quirks und Standards-Modus

Das Steuerelement gibt zwei benutzerdefinierbare Eigenschaften für Höhe und Breite frei. Diese beiden Attribute können entweder als Prozentsatz oder als Pixelwert definiert werden.

Innerhalb der Kontrolle habe ich zwei Spalte Divs, die eine Navigationsleiste und den Inhalt der Steuerelemente enthalten. Die Spalten müssen eine Div sein, um den Überlaufstil zu verwenden, wenn der Inhalt größer als der Container ist. Siehe Beispiel-Prototypcode unten;

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
     <title></title> 
    </head> 
    <body> 
     <div style="height: 100%; width:400px; background-color: Green; "> 
      <div style="height: 100%; width: 25%; background-color: Red; float:left; overflow:auto;"> 
       LongString:<br />Stuffsdfsfdsdfsfsdfdfsdfsdfsdfsdfsdxgsdfgsdfgsdgiusdfgiudfgifdgu 
      </div> 
      <div style="height: 100%; width: 75%; background-color: Pink; float:right;"> 
       Stuff 
       <br /> 
       More stuff 
       <br /> 
       And some more 
      </div> 
      <div style="clear:both;"></div> 
     </div> 
    </body> 
</html> 

Das Problem, das ich in laufen, ist, dass Modus in Standards, wenn Prozent Fußhöhe mit, da die divs nur als deren Inhalt so groß erwartet machen. Es scheint, dass die einzige Möglichkeit zur Lösung dieses Problems die Verwendung von JavaScript ist.

Dies führt zu Problemen, da das Steuerelement asynchron mit AJAX erneut rendern kann und die Höhen nicht mehr synchron sind.

Ist das, was ich versuche, unmöglich zu erreichen oder suche ich am falschen Ort?

Nick

+0

verstehe ich nicht, warum dies zu machen, muss sowohl in Macken und Standards-Modus. Entweder eine gültige DocType oder nicht, richtig –

+0

? Leider ist die Steuerung verwendet werden muss, in Asp.net Anwendung die im Standard - und Quirks - Modus laufen – Nick

Antwort

0
<div style="height: 100% 

100% von dem, was? Das div ist nicht absolut positioniert, also ist die Antwort sein Elternteil. Elternteil ist Körper.

Wie hoch ist der Körper? Keine Angabe: Standardwert ist auto. auto bedeutet, dass die Höhe des Körpers aus der Höhe seines Inhalts berechnet wird. Der Fehler im Quirks-Modus ist, dass body eine minimale Höhe hat, die dem Ansichtsfenster entspricht.

Setzen Sie sowohl html als auch body auf height: 100%, um wirklich 100% im Standardmodus zu erhalten.

+0

Entschuldigung, ich habe es in der Frage nicht klargestellt, da der Code für ein Server - Steuerelement ist, habe ich keine Kontrolle über den Stil des HTML - Tags oder des Body - Tags nur um das gerenderte Mark-up zu demonstrieren – Nick

+0

Dann ist das einzige, was Sie noch übrig haben, den Wrapper div 'position: absolute' zu machen, in diesem Fall 'height: 100%;' ist jetzt relativ zum initial Containing Block (das Viewport)). – bobince

0

Ich hasse es zu sagen, aber manchmal, wenn ich mit alten Browsern arbeiten muss, wird die Arbeit manchmal schneller erledigt. Versuchen Sie <Tabelle> Tags. :(

<table style="height: 100%; width:400px; background-color: Green; "> 
    <tr> 
     <td style="height: 100%; width: 25%; background-color: Red; overflow:auto;"> 
      LongString:<br /> 
      Stuffsdfsfdsdfsfsdfdfsdfsdfsdfsdfsdxgsdfgsdfgsdgiusdfgiudfgifdgu 
     </td> 
     <td style="height: 100%; width: 75%; background-color: Pink; "> 
      Stuff 
      <br /> 
      More stuff 
      <br /> 
      And some more 
     </td> 
    </tr> 
</table> 
Verwandte Themen