Komme nicht weiter mit rechtsbündiger Box

[Christian]

Hi,

Ich komme einfach nicht weiter, ich habe eine Box:

  
#TopLinks  
{  
 position:     absolute;  
 margin-left:    0px;  
 margin-top:     0px;  
 height:      22px;  
 width:      692px;  
}  

Jetzt brauche ich eine 2. Box, die von Position x = 692 bis zum rechten Browser Rand geht.

  
#TopRechts  
{  
 position:     absolute;  
 padding:     0px;  
 height:      22px;  
 left:      692;  
 top:      0px;  
 right:      0px;  
 margin-right:    0px;  
}  

Opera und FireFox verstehen mein Anliegen auch, nicht aber der InternetExplorer :-/
Was mache ich denn für den?

Danke schon mal
Bye, Chris

[Gunnar Bittersmann]

Jetzt brauche ich eine 2. Box, die von Position x = 692 bis zum rechten Browser Rand geht.

Christian,
Und wenn x = 692 schon jenseits des rechten Browserrands ist?

(BTW: Agovis)

Was mache ich denn für den?

Nicht nur für den, sondern für alle: Verzicht auf absolute Positionierung und Einsatz von http://de.selfhtml.org/css/eigenschaften/positionierung.htm#float@title=float.

Live long and prosper,
Gunnar

[Christian]

Einsatz von http://de.selfhtml.org/css/eigenschaften/positionierung.htm#float@title=float.

So:

  
#TopLinks  
{  
 height:      22px;  
 width:      692px;  
 padding:     0px;  
 float:      left;  
}  

  
#TopRechts  
{  
 padding:     0px;  
 height:      22px;  
 left:      692;  
 width:      100%;  
 top:      0px;  
 right:      0px;  
 margin-right:    0px;  
 float:      right;  
}  

Jetzt sieht man leider die TopRechts gar nicht mehr :-/

[Ingo Turski]

Hi,

left:      692;

was soll das Deiner Meinung nach bewirken?

width:      100%;

unnötig und kontraproduktiv hierfpr.

top:      0px;
right:      0px;

Unsinnig, da Du kein positioniertes Element mehr hast.

margin-right:    0px;

Überflüssig, da Voreinstellung.

float:      right;

Wozu floaten? Du willst doch ene variable Breite.

Schau' Dir bitte http://de.selfhtml.org/css/layouts/anzeige/2spaltig_links.htm an.

freundliche Grüße
Ingo

[Christian]

Schau' Dir bitte http://de.selfhtml.org/css/layouts/anzeige/2spaltig_links.htm an.

Ja, das funktioniert auch in Opera, wenn ich mein CSS soweit umwandle, dass es identisch ist, nur bei IE ist eine ca. 4 px breite Lücke zwischen den beiden Boxen :-/
Firefox macht das auch richtig.

Habe auch schon verschiedene HTML-Doctypes probiert, hilft irgendwie alles nicht :-/

  
#TopLinks  
{  
 height:      22px;  
 width:      692px;  
 padding:     0px;  
 float:      left;  
 margin:      0;  
 border:      1px dashed silver;  
}  
  
#TopRechts  
{  
 padding:     0px;  
 height:      22px;  
 margin-left:    0px;  
 border:      1px dashed silver;  
}  

Wo kommt denn da die Lücke zwischen beiden divs her?

[Ingo Turski]

Hi,

Schau' Dir bitte http://de.selfhtml.org/css/layouts/anzeige/2spaltig_links.htm an.

Ja, das funktioniert auch in Opera, wenn ich mein CSS soweit umwandle, dass es identisch ist, nur bei IE ist eine ca. 4 px breite Lücke zwischen den beiden Boxen :-/

Bist Du sicher, daß es nicht 3px sind? In diesem Beispiel fällt der IE-Bug noch nicht auf, aber wenn Du Dir diese Dokumentationsseite komplett durchliest, wirst Du auch auf einen Workaround stoßen.

freundliche Grüße
Ingo

[Cyx23]

Hallo Chris,

Opera und FireFox verstehen mein Anliegen auch, nicht aber der InternetExplorer :-/
Was mache ich denn für den?

mal abgesehen vom Rendermodus / Doctype würde ich erstmal so für ähnliche Bedingungen sorgen:

*{margin:0;padding:0}

Grüsse

Cyx23

[Klawischnigg]

Hi there,

left:      692;

vielleicht ja stößt sich der IE an den fehlenden Einheiten ...