• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

<div>-Hintergrund füllen

Status
Für weitere Antworten geschlossen.
S

spitzklammermann

Neues Mitglied
Hi! Kann mir jemand helfen ?

Ich möchte gerne mit einem Layer, der nur eine Hintergrundfarbe hat, andere Layer überdecken. Z-Index habe ich schon hochgesetzt, aber es werden nur da die unten liegenden Ebenen verdeckt, wo die verdeckende Ebene auch einen Inhalt hat (zB innerhalb des Textes). Gibt es da vielleicht einen Trick, mit dem ich einer Ebene einen überdeckenden Hintergrund verpassen kann? Es sollte genau über die definierte Breite und Höhe meiner verdeckenden Ebene gehen.

Hier ein Beispiel, wo man sowas brauchen könnte.

HTML: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de">
<head>
    <title>Problem mit dem Scrollen</title>
    <link rel="stylesheet" type="text/css" href="./basis.css" />
</head>
<body>
<div style="background-color: White; z-index: 2; left: 0;    position: fixed; width: 500px;">
         <div style="color: Black; position: absolute; left: 15px; top: 93px;">
                     <p>Der gescrollte Text sollte oberhalb der Linie hier überhaupt nicht zu sehen sein.</p>
                    <hr style="width:500px; height:2px;" /> 
         </div>
</div>
<div style="position: absolute;    left: 15px;    top: 195px;    width: 32em; height: 1000px; background-color: Blue; overflow: scroll; overflow-x: hidden; overflow-y: scroll;>
         <p>Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         Dieser Text soll gescrollt werden<br />
         </p>
</div>
</body>
</html>

Ich sag dann schonmal Danke für eure Hilfe!
Grüße, Spitzi
 
Zuerst einmal eine Frage: hee? Ich habe keine Ahnung was du möchtest ^^
Aber ich rate einfach mal wild rum gebe dir diesen Codeschnipsel.
Falls es nicht das ist was du brauchst, erklär dein Problem nochmal :)
Einfach:
HTML: 
<div style="background-color: White; z-index: 2; left: 0;    position: fixed; width: 500px;">         
  <div style="color: Black; position: absolute; left: 15px; top: 93px;">
    <p>Der gescrollte Text sollte oberhalb der Linie hier überhaupt nicht zu sehen sein.</p>                    
    <hr style="width:500px; height:2px;" /> 
  </div>
</div>
durch
HTML: 
<div style="background-color: white; z-index: 2; top:250px; left: 10; position: absolute; width: 500px;">
    <p>Der gescrollte Text sollte oberhalb der Linie hier überhaupt nicht zu sehen sein.</p>
    <hr style="width:500px; height:2px;" /> 
</div>
ersetzen

Ahja noch eine ZUsatzinfo:
position:fixed; gibts im Internet Explorer nicht
 
Ich möchte eigentlich nur eine Ebene, die den Rest verdeckt. Eine Ebene wie
"<div style="z-index:2; background-color:white; top:20px; left:20px; width:300px; height:300px;">" Sie soll alles unter ihr auf der Webseite verdecken; und zwar mit Weiss.
Es wird aber nur da weisser Hintergrund angezeigt, wo diese Ebene auch tatsälich Inhalt hat, zB. ein GIF oder ein Text.
Ich möchte aber, dass diese Ebene einfach alles verdeckt, was unter ihr ist.
Gibt es da nicht einen Trick? Habe es auch schon mit einem weißem Pixel als Grafik im Hintergrund, der sich immer wiederholt, versucht. Leider vergebens.

Ich glaube ich seh nur einfach den Wald vor lauter Bäumen nicht.;ugl
Gruß Spitzi
 
Status
Für weitere Antworten geschlossen.

Neueste Beiträge

Zurück
Oben