tutorials.de - Bild über background: url(...) wird im Div nicht angezeigt | Demo #1

by SpiceLab

HTML

<div id="header">
      <div id="linkerRand"></div>
      <div id="logo">Logo</div>
      <div id="rechterRand"></div>
      <div id="rechterRandDown"></div>
 </div>

 <div id="rahmen">
  <div id="links">
   <div id="MenueTop">Menü Top</div>
   <div id="Menuepunkt1"> Preise </div>
   <div id="Menuepunkt2"> Über mich </div>
   <div id="Menuepunkt3"> Wissen </div>
   <div id="Menuepunkt4"> Bilder </div>
   <div id="MenueBottom"> Menue Bottom </div>
   <div id="LeftPfoetchenDown">Bis zum Rand des Footers verlängern</div>
  </div>
  <div id="mitte">Hier kommt der Inhalt rein<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
  <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
  <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
  <br><br><br><br><br><br><br><br><br><br><br><br>
  </div>
  <div id="rechts">Bis zum Rand des Footers verlängern</div>
 </div>

 <div id="footer">Footer</div>

CSS

body {
   background-color: rgb(255, 236, 247);
   text-align: center;
}

#header {
 width: 980px;
 height: 169px;
 background: blue;/*url{"left_header_rand.png"} no-repeat;*/
}

#linkerRand {
 float: left;
 width:  45px;
 height: 169px;
 background: url("left_header_rand.png") no-repeat;
}

#logo {
 float: left;
 width: 221px;/*221px;*/
 height: 169px;
 background: url("logo.png") no-repeat;
}

#rechterRand {
 background: url("pfoetchen.png") repeat-x;
 float: left;
 height: 169px;
}

#rechterRandDown {
 float: right;
 width: 116px;
 height: 169px;
 background: url("right_header_rand.png"); ;
}

#rahmen {
/*
float: both;
width:980px;
background: white;
*/
width:980px;
margin: 0 auto;
background: green repeat-y 50% 0;
/*background: white repeat-y 50% 0;*/
}

#links {
float: left;
width: 266px;
background: blue;
}

#MenueTop {
width: 266px;
height: 259px;
background: url("menue_top.png");
clear: both;
}

#Menuepunkt1 {
background: url("https://www.tutorials.de/data/avatars/m/244/244972.jpg?1415390780") no-repeat;/*yellow;   */
/*background-attachment: fixed;*/
width: 267px;
height: 97px;
clear: both;
}

#Menuepunkt2 {
width: 267px;
height: 97px;
background: green;
clear: both;
}

#Menuepunkt3 {
width: 267px;
height: 97px;
background: white;
clear: both;
}

#Menuepunkt4 {
width: 267px;
height: 97px;
background: blue;
clear: both;
}

#MenueBottom {
width: 267px;
height: 243px;
background: orange;
clear: both;
}

#LeftPfoetchenDown {
width: 267px;
height: 156px;
background: green repeat-y;
clear: both;
}

#mitte {
float: left;
width: 598px;
height: auto;
background: red;
}

#rechts {
float: right;
width: 116px;
height: 100px;
background: green repeat-y;
}

#footer {
 width: 980px;
 height: 40px;
 background: blue;/*rgb(255, 236, 247);*/
 margin-top: 5px;
 clear: both;
}