Verschachtelung

[Giovanni Rena]

Hallo,

ich programmiere mir gerade ein Menü. Dabei möchte ich eine Box erstellen

#MenuBox     { position:absolute; top:100px; left:100px; width:400px;  height:40px;  padding:0px;  background-color:#FFFFFF; }

Und in diese weitere Elemente hineinpacken:

Button1     { width:80px;   height:20px;  padding:1px;  background-image:url(Button.gif); text-align:center; font-weight:bold; }
#Button2     { width:80px;   height:20px;  padding:1px;  background-image:url(Button.gif); text-align:center; font-weight:bold; }

Verschiebt man nun die erste Box, indem man top oder left ändert, sollen sich auch die darin befindlichen Elemente mit verschieben. Aber wie sag ich, dass MenuBox ihr Elternelement ist. Benutze ich position:relative, so stimmt das zweite Element (Button2) nicht, und sitzt irgendwo ganz an ner verschiedenen stelle, auch so mit fixed. Wie bekomm ich einen Art Container hin?

Gruß Giovanni

[MudGuard]

Hi,

#MenuBox     { position:absolute; top:100px; left:100px; width:400px;  height:40px;  padding:0px;  background-color:#FFFFFF; }
Button1     { width:80px;   height:20px;  padding:1px;  background-image:url(Button.gif); text-align:center; font-weight:bold; }

Gibt es ein Element namens Button1 in Deiner Dokumentsprache=

#Button2     { width:80px;   height:20px;  padding:1px;  background-image:url(Button.gif); text-align:center; font-weight:bold; }

Aber wie sag ich, dass MenuBox ihr Elternelement ist.

Indem Du im Dokument die Elemente direkt innerhalb des Elements mit der ID MenuBox notierst.

Wie bekomm ich einen Art Container hin?

Element auf, Inhalt rein, Element zu. Fertig ist der Container.

cu,
Andreas

[Zeromancer]

Hallo Giovanni,

Button1     { width:80px;   height:20px;  padding:1px;  background-image:url(Button.gif); text-align:center; font-weight:bold; }

hier fehlt die "#"

Warum nimmst du keine Liste? Schöne Beipiele findet man zum Beispiel auf http://css.maxdesign.com.au/listamatic/.

Mit freundlichen Grüßen

André