isabel: überlappende divs

Beitrag lesen

liebes Forum,

ich hab folgendes Problem:
Ich hab ein CodeBeispiel beigelegt, was alles verdeutlichen müßte:
Ich hätte gern, das die 'workspaceDivs' übereinander liegen.
Bisher kann ich sie nur untereinander anordnen, der z-index geht nicht??
Wahrscheinlich, weil ich kein Position absolut genommen habe.
Die 'WorkspaceDivs' sollen wie die 'Actdivs'zentriert liegen.

Ist das verständlich und kann mir jemand helfen?

Grüße
Isabel

<html>
<head>
<title>Untitled Document</title>
<style type="text/css">
<!--

.container{
  border: 1px solid black;
  text-align:center;
}

.formAct1{
  border: 1px solid green;
  white-space:nowrap;
}

.workspace1{
  border: 1px solid blue;
  width:30px;
  height:30px;
  z-index:10;

}

.workspace2{
  border: 1px solid red;
  width:300px;
  height:10px;
  z-index:20;

}
.workspace3{
  border: 1px solid green;
  width: 100px;
  height:50px;
  z-index:30;

}

-->
</style>

</head>
<body style="  margin-left:auto; margin-right:auto;">
<div id="container" class="container">

<span id="act1" class="formAct1">
    <a href="#" class="formMenu formFontFamily formText">Activity Details</a>
  </span>

<span id="act2" class="formAct1">
    <a href="#" class="formMenu formFontFamily formText">Documents</a>
  </span>

<span id="act3" class="formAct1">
    <a href="#" class="formMenu formFontFamily formText">Delegation History</a>
  </span>

<div id="workspace1" class="workspace1">
    workspace
  </div>
   <div id="workspace2" class="workspace2 ">
    workspace
  </div>
  <div id="workspace3" class="workspace3">
    workspace
  </div>
</div>

</body>
</html>