Container am oberen Rand, der den Inhalt verdeckt

prey2003

Grünschnabel
Hallo zusammen,

wie kann ich einen DIV-Container erstellen, der am oberen Bildschirmrand positioniert ist und den Inhalt darunter verdeckt. Den Container möchte ich kuzrzeitig einblenden, um Statusmeldungen anzuzeigen. Ein Beispiel wie das ganze aussehen könnte gibt es auf http://bit.ly zu sehen. Gibt man dort eine URL an und klickt dann auf die erscheinende Kurz-URL, so taucht im oberen Bildschirmrand eine Meldung mit der Information auf, dass die URL erfolgreich in die Zwischenablage kopiert wurde.

Kann mir jemand helfen oder einen Tipp geben?

Mfg
prey
 
Die Positionierung bleibt mir ein Rätsel.

Code:
	<style type="text/css">
	<!--
	#div1 {
		height:100px;
		background-color:red;
		position: absolute;
		top: 0;
	}
	
	#div2 {
		height:80px;
		background-color: green;
		position: absolute;
		top: 0;
	}
	-->
	</style>

HTML:
<body>

<div id="div1"></div>
<div id="div2"></div>

</body>

Wie man sieht sieht man nichts! Nicht einer der beiden Container wird angezeigt! Was läuft hier falsch?

Mfg
prey
 
Wie man sieht sieht man nichts! Nicht einer der beiden Container wird angezeigt! Was läuft hier falsch?
Bedingt durch die absolute Positionierung fehlt hier jeweils eine width-Regel:

CSS:
#div1 {
		height:100px;
		background-color:red;
		position: absolute;
		top: 0;
		width: 100%; /* z.B. eine relative Breite */
	}
	
#div2 {
		height:80px;
		background-color: green;
		position: absolute;
		top: 0;
		width: 100%; /* z.B. eine relative Breite */
	}


mfg Maik
 
Zurück