XHTMLforum

XHTMLforum (http://xhtmlforum.de/index.php)
-   CSS (http://xhtmlforum.de/forumdisplay.php?f=73)
-   -   Problem mit tranparenten png und bg (http://xhtmlforum.de/showthread.php?t=53515)

Granner 07.09.2008 12:04

Problem mit tranparenten png und bg
 
Liste der Anhänge anzeigen (Anzahl: 1)
Ich bin grad dabei ne HP zu erstellen klappte bis jetzt auch alles super. nur der header (s. pic) will einfach nicht über das nav layer...

Code:

<?xml version="1.0"?>
<!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">
 <head>
  <meta http-equiv="Cotent-Type" content="text/html; charset-utf-8" />
  <title>Portfolio: Christoph Weinzierl</title>
  <script type="text/javascript" src="jquery.js"></script>
  <script type="text/javascript" src="layout.js"></script>
  <style type="text/css">
  /* <![CDATA[ */
/*
        ===========================================================================
        @desc:                CW StyleSheet
        @version:        September 03, 2008        15:07
        @copyright:        Christoph Weinzierl | CW | www.christoph-weinzierl.de.vu
        ===========================================================================
*/
/*=== [Basic] ==============================================================*/
html, body {
      margin:0em;
      padding:0em;
}
body {
      font: 100.01% sans-serif;
      background: url(bg.jpg) no-repeat bottom left fixed;
      color: #E6DCCF;
      text-align: center;
}

/*=== [Header] ============================================================*/
#wrapper {
      height: 200px;
      width: 738px;
      border: 0px solid #604420;
      border-bottom: 0px solid #604420;
      padding: 10px 0;
      text-align: left;
      margin: 0 auto;
      width: 40em;
}
#header {
background: url(header3.png) no-repeat top left;
z-index: 2;
overflow: visible;
      height: 200px;
      width: 738px;
      border: 0px solid #604420;
      border-bottom: 0px solid #604420;
      padding-bottom: 0em;
margin-bottom: -1em;
      text-align: center;
 
}
/*=== [Navbar] ===========================================================*/
#nav {
      background:url(verlauf.png) repeat-x left top;
      z-index: 1;
      margin: 0;
      border-bottom:3px solid #b3d442;
      list-style-type:none;
      height: 40px;
 }

#nav ul {
      margin:0;
      list-style-type:none;
}

#nav li a:hover {
      background:url(arrow.gif) no-repeat center bottom;
      color:#b3d442;
}

#nav li {
      float: left;
}

#nav li a {
      display:block;
      padding: 1em 1.3em 0.3em;
      font:bold 16px "Trebuchet MS";
      text-decoration:none;
      color:#b3d442;
      letter-spacing: -0.1em;
}

#nav li a.current {
      padding-top: 1em;
      background:url(arrow.gif) no-repeat center bottom;
      color:#b3d442;
}
/*=== [Loader] ============================================================*/
#load {
        display: none;
        position: absolute;
        right: 10px;
        top: 10px;
        background: url(ajax-loader_gray.gif);
        width: 43px;
        height: 11px;
        text-indent: -9999em;
}

/*=== [Footer] ============================================================*/
#footer{
text-align:center;
      position: fixed;
      bottom: 0em;
      right: 0em;
      padding-top: 0em;
      margin-bottom: 0em;
      background: url(bgc.png);
      border: 0px solid;
}

#footer a img{
      text-align: center;
      border: 0px solid;
      padding-bottom: 0px;
            margin-right: 0px;
}
#footer ul {
text-align: center;
margin-bottom: 0em;
}

#footer ul li{
text-align: center;
      display: inline;
}

#footer p {
      margin: 0.5em;
      margin-bottom: 0em;
      margin-top: 0em;
      font-size: 0.8em
}
/*=== [General] ===========================================================*/
a img {
      border: 0px solid;
}

h1 {
      font-size: 1.3em;
      border-bottom: 1px solid #b3d442;
}

h3 {
      font-size: 1.1em;
      margin: 2em;
}

p {
      font-size: 0.9em;
      margin-left: 2em;
}

h1:first-letter{
      color: gray;
      font-size: 1.2em;
}

.firstGray {
      color: #665f5f;
      font-size: 1.5em;
}
/*=== [Hack IE 5.0] =======================================================*/
* html #navigation ul a {
      width: 1em;
      w\idth: auto;
}
#content {
      color: #FFF;
      background-color:#b3d442;
      border-left: 3px solid #665f5f;
      border-top: 3px dashed #665f5f;
      margin-bottom: 2em;
}
/* ]]> */
</style>
 </head>
 <body>

  <div id="wrapper">
  <div id="header">
  </div>
  <ul id="nav">
      <li><a href="index.html" class="current">Willkommen</a></li>
      <li><a href="about.html">About:Me</a></li>
      <li><a href="index.html">Works</a></li>
      <li><a href="index.html">Links</a></li>
      <li><a href="index.html">Kontakt</a></li>
  </ul>
  <div id="content">
      <h1>Willkommen, willkommen</h1>
      <p>balba</p>
  </div>
  </div>
  <div id="footer">
  <ul>
    <li><a href="impressum"><img src="media/images/impress_icon.png" alt="Impressum"/></a></li>
    <li><a href="disclaimer"><img src="media/images/disclaimer_icon.png" alt="Disclaimer"/></a></li>
  </ul>
  <p>&copy; 2008 by Granner</p>
  </div>
 </body>
</html>

danke schon mal im vorraus

IChao 07.09.2008 12:49

Die Eigenschaft z-index allein hat keine Wirkung, sondern nur in Kombination mit einer Positionierung != static.

Granner 07.09.2008 13:04

Danke für die schnelle Antwort, klappt wunderbar! :D


Alle Zeitangaben in WEZ +2. Es ist jetzt 21:12 Uhr.

Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2020, vBulletin Solutions, Inc.

© Dirk H. 2003 - 2019