✔ Hintergrund aus Div hinter den Inhalt

I

Identität

Erfahrenes Mitglied
Hey Leute,

ich habe eine Website, in einem div befindet sich ein Hintergrundbild. Das Hintergrundbild soll auch unter den Inhaltsbereich gehen, liegt jedoch leider darüber. Ich habe euch den Code + ein Bild angehängt. Vielleicht könnt ihr mir ja helfen. Vielen Dank!

Bild:
http://img20.myimg.de/muster69385.gif

Code: 
#blatt{
    width: 1005px;
    height: 130px;
    position: relative;
    top: 218px;
    left: -45px;
    background:transparent url(../images/blatt.gif) no-repeat;
}

Code: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Startseite</title>
    <link rel="stylesheet" type="text/css" href="styles/styles.css" />

</head>

<body>
    <div id="container">
        <a href="index.php"><img src="images/logo.gif" alt="Logo" class="logo" border="0"></a>
NAVI
        <div id="blatt">Test</div>
        <div id="header">
            <div id="slideshow2" style="margin: 4px 0 0 4px;">
              <img src="images/aussenansicht.jpg"  />
            </div>
        </div>
        <br style="clear: both;">
        <div id="left">


                <img src="images/teaser_galerie.jpg" />


TEASER


                    <img src="images/indoor.gif" />

        </div>
        <div id="right">

INHALT
    </div>
</body>
</html>
 
Super, danke für den Hinweis. Mit z-index: -1; funktionert es wunderbar. :)
Aber warum muss es -1 sein, ich hatte es vorher mit 1 probiert.
 
Und was ist mit z-index:0 für #blatt, sowie z-index:1 für #left und #right?

mfg Maik
 
Ich hatte zum testen #blatt einmal z-index 1 gegeben und den anderen 2, das hatte nicht hingehauen. Aber naja, jetzt funktioniert es. :)
 
Dann besitzen bei dir #left und #right keine Angabe zu position (absolute oder relative), denn:
http://de.selfhtml.org/css/eigenschaften/positionierung.htm#z_index hat gesagt.:
Diese Eigenschaft wirkt nur in Verbindung mit einer Angabe zu position.
Zum Vergrößern anklicken....

In einem Probelauf mit deinem Codesnippet funktioniert mein Vorschlag aus Post #4 einwandfrei.

mfg Maik
 
Ein kurzes leicht verständliches Tutorial gibt es auch hier:

z-index

Übrigens solltest Du auf Dein XHTML achten.

Du hast bei br einmal den Schrägstrich vergessen und bei Deinem logo.gif.

<br style="clear: both;" />

<a href="index.php"><img src="images/logo.gif" alt="Logo" class="logo" border="0" /></a>

Sonst ist das nicht XHTML valide.
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück