position:absolute; willl nicht!

[Witschi262]

Hallo!
Ich habe mir mal ein Design mit CSS erstellt und stehe nun vor einem Problem.
Es ist ein Zwei-Spaltenlayout.
Nun soll die rechte Spalte natürlich auch rechts sein.Damit aber die rechte Spalte keine Auswirkung auf andere Objekte hat, und andere Objekte keine Auswirkung auf die rechte Spalte hat, möchte ich dem Objekt position:absolute; zuweisen.

Der CSS Code lautet wie folgt:

#minitop {
position:absolute;
left: 748px;
top: 200px;
height:23px;
background-image: url(../images/Design/minicontent.png);
background-repeat:no-repeat;
}

Doch leider wird das Objekt nichteinmal angezeigt.Was mache ich falsch?Ich habe es auch mit einem z-Index versucht, bin daran jedoch auch gescheitert.
Der Link zur Seite:
RageHabZ | Version 3
Die rechten Sidebars sind leider nicht "richtig".Wenn ich beim' großen Hauptcontent die Spalten verkleiner, gehen die Sidebars nach oben, da die Rechte Spalte nach dem unteren (bottom) "Objekt" der linken Spalte angepasst ist.Verkleiner ich also den großen Content springen die Sidebars nach oben.

Dies sollte nicht passieren, wenn ich nun position:absolute; einfüge.
Wo liegt mein fehler?

 

[Kojaky]

Wie breit is das bild denn bei 23px höhe? und schon versucht eine width anzugeben?

 

[Efchen]

Nun soll die rechte Spalte natürlich auch rechts sein.Damit aber die rechte Spalte keine Auswirkung auf andere Objekte hat, und andere Objekte keine Auswirkung auf die rechte Spalte hat, möchte ich dem Objekt position:absolute; zuweisen.

Das empfehle ich Dir anders. Benutze "float:right".

 

[Witschi262]

Effchen,
genau das funktioniert genauso wenig.
Ich kann mit dem Objekt machen was ich möchte, diesem Objekt interessiert es nichtmal die Bohne!

 

[Gilles]

Effchen,
genau das funktioniert genauso wenig.
Ich kann mit dem Objekt machen was ich möchte, diesem Objekt interessiert es nichtmal die Bohne!

Du kannst float right ja auch nicht position absolute kombinieren. hab es eben mal umgemodelt, sodass ich das Element sehen konnte. Die Positionierung auf 768 zu setzen ist sowas nicht so klug. du hattets außerdem keine Breite gesetzt.
Und jetzt stell dir mal vor. Deine left Position von 760 + die 200 Breite. Das Bedarf ja minimum einer Viewportbreite von 960 Pixel.
Setze erstens Breite auf das Element und zweitens mach es mit float right (aber vergess die positionierung nicht umzustellen auf relative)

 

[Witschi262]

Als ich float:right;
eingesetzt habe, war position absolute bereits rausgenommen.

Edit:
Float:right; funktioniert zwar, ist aber immernoch nicht absolut positioniert, wie ich es vorher haben wollte.
Das ganze hat immernoch einfluss auf andere Objekte, was ich genau vermeiden will!Außerdem war das Float:right; eigentlich absichtlich nicht genommen, da es mit großen Bildschirmen vogelwild aussieht!Das ganze Design ist nähmlich linksbündig!

 

[Gilles]

Wenn du Firebug (Addon für Firefox) benutzt, kannst du das Element im HTML anklicken und siehst, wo es sich befindet. Kannst mit Firebug auch CSS sofort abändern. Hol dir das am besten mal :)

 

[Witschi262]

Habe mir das ganze mit FireBug angeschaut und habe glaube ich mal das Problem erkannt.
Ich brauche in jedem Objekt eine width angabe, da sie sonst von rechts nach links über den Bildschrim gehen, richtig?

 

[Gilles]

Da du Divs nimmst (warum auch immer du das machst) ist der display typ block (korrigieren wenn es nicht stimmt), da Divs als Default vom Display Typen her Block-Elemente sind.
Der beste Weg das ganze zu designen ist folgender.
Du schreibst erst dein HTML auf und denkst erst dann an das Design.
Würde an deiner Stelle das HTML und CSS komplett neu machen (die Bilder behälst du natürlich ;))
Denn du hast dir da eine richtige Div-Suppe gekocht. Und zwar hast du auch teilweise unnötige Divs benutzt.
probier das HTML mal neu auszuzeichnen. Und arbeite am besten nicht mit Display: absolute.
Das verwirrt nur

 

[Witschi262]

Okay..
das sagen mir schon viele. Dann verusche ich es mal neu.