• Das Erstellen neuer Accounts wurde ausgesetzt. Bei berechtigtem Interesse bitte Kontaktaufnahme über die üblichen Wege. Beste Grüße der Admin

z-index-Problem

Trojax

Trojax

New member
Hallo-folgendes Problem-alles sieht auf der seite so aus wie ich es möchte-linkes Menu und banner fix auf der Seite-der Inhalt-also content kann gescrollt werden. Allerdings soll dieser unter dem Banner Verschwinden un d nicht darüber liegen und diesen verdecken. Wo ist der Fehler? Kann mir jemand helfen?
Als "content.php" hab ich einfach mal ne längere Textdatei genommen.



HTML: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
 "http://www.w3.org/TR/xhtml1/DTD/Strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de"> <head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="Author" content="Daniel Jung" />
<meta name="description" content="neue seite" />
<meta name="keywords" content="seite" />
<style type="text/css"><!--
body 
{
 font-family:Verdana;
 font-size:12px;
 background-color:#9999ff;
}
h1 {font-size:26px;color:#000000;margin-bottom:0px;}
h2 {font-size:16px;color:#000000;}
h3 {font-size:14px;color:#000000;}
p {margin-top:0px;}

code {font-size:14px;color:#0000ff;}
pre
{
 font-size:14px;
 color:#0000ff;
 padding:5px;
}
a:link, a:visited, a:active, a:hover
{ 
  text-decoration:none;
  font-weight:bold;
  color:#634142;
  font-size:12px;
}
a:active, a:hover
{ 
 text-decoration:underline;
}

#title {
height:70px;
padding:5px;
border-bottom:1px solid #000000;
margin-bottom:20px;
position:fixed;
z-index = 2;
 background-color:#9999ff;
}
#left {
position:fixed;
top: 123px;
width:14%;
float:left;
line-height:18px;
z-index = 3;
 background-color:#9999ff;
}
.menutitle
{
font-weight:bold;
border-top:1px dashed #000000;
margin-top:15px;
}

#content {
position: relative;
top: 90px;
width:80%;
float:right;
z-index = 0;
background-color: white;
}

#left a{
color:maroon;
font:bold 13px verdana, sans-serif;
margin:5px 0 5px 0;
padding:1px 3px 1px 4px;
text-decoration:none;
background:transparent;
display:block;
border-top:1px solid #e4d9c0;
border-right:1px solid #837c6b;
border-bottom:1px solid #837c6b;
border-left:1px solid #e4d9c0;


width:155px;}

#left a:hover{
color:#f6e4c1;
background:transparent;
border-top:1px solid #99917d;
border-right:1px solid #e4d9c0;
border-bottom:1px solid #e4d9c0;
border-left:1px solid #99917d;
}



//--></style>
<title>Muttis Seite</title>
</head>
<body>
<div id="title">
<img src="logo6.gif" style="float:right;width:156; height:39;margin-left:3px;" alt="Logo" />
<h1> Vertraulich - Kompetent - Sicher</h1></div>

 <div id="left" style="clear:right;">
<p class="menutitle">MENU </p>
<a class="menu" href="index.php?allgemeines=allgemeines">Allgemeines</a><br />
<a class="menu" href="index.php?qualifikation=qualifikation">Qualifikation</a><br />
<a class="menu" href="#">Angebote</a><br />
<a class="menu" href="#">Anfahrt</a><br />
<a class="menu" href="#">Anmelden</a><br />



 </div>
 <div id="content"><p>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br>
Dies ist ein Beispieltext<br></p>
 </div>
<p style="text-align:left;clear:both;margin-top:20px;"><a class="prev" href="index.html#example">Zurück</a></p>
</body>
</html>
 
Zuletzt bearbeitet:
Mist-ich suche heute schon seit ein paar Stunden aber kann leider absolut nichts finden warum das nicht so geht wie ich wil :( :confused: :(
Bin für jede Art Hilfe dankbar!
Lg Daniel
 
Also ich kann Dir da nicht helfen.
Wenn ich die Datei aufrufe, sehe ich nur das Menü und sonst nix.
Kann mir Deine Beschreibung des Problems auch nicht vorstellen.
Wenn Du das mal im Space hättest, wäre Dir eventuell besser zu helfen,
damit man sich mal ein Bild davon machen kann.
 
Hi dk,
naja,leider kann ichs grade nicht Ansehfähig hochstellen. Hab den Quelltext mal so gemacht dass man ihn einfach so anschauen kann(der php-Inhalt war ja eher sinnlos an dieser Stelle).
Das Problem sieht man dann ganz deutlich-obwohl der content nen niedrigeren z-index hat als der Banner(title) hat verschwindet beimm scrollen der Banner unter dem Inhalt-was ja genau andersherum sein soll.
Danke auf jeden Fall schonmal-ich hoffe man merkt was ich meine-bei mir gings.
Lg Daniel
 
So wie ich das sehe mußt Du gar nicht die Sache mit z-index machen, sondern deinem Content-Div eine feste Höhe geben und dann machst Du overflow:scroll;
 
Bin nooch am Versuchen-denke aber das sollte klappen.
Schonmal ganz ganz herzlichen Dank.
Lg Daniel
 
Du musst dich einloggen oder registrieren, um hier zu antworten.
Zurück
Oben