CSS Horizontal Menu - Aufgeklappte Menues verschwinden hinter Content

ottyscom · Post by **ottyscom** » Tue Jun 02, 2009 12:49 am

Hallo allerseits,

Ich habe folgdendes Problem. Komme einfach nicht dahinter.

Habe auf einer CMS Seite oben eine CSS Menu Leiste Horizontal mit aufklapbaren Menues. Nur wenn man diese aufklappt verschwinden die hinter dem Content Kasten.

Ich weis nicht ob ihr wisst was ich meine aber wenn jemand mir helfen will sende ich im gerne die Adresse der entsprechenden Seite. Danke schonmal

antibart · Post by **antibart** » Tue Jun 02, 2009 7:23 am

Vermutung:

1. Falls Du mit Layern arbeitest: Wenn ein Layer hinter einem andern verschwindet, könnte es daran liegen, dass die Reihenfolge der Layer falsch ist. Untersuch mal die Werte des Attributes z-index iin deinen css. Der hinterste Layer muss den niedrigsten Wert haben.

Beispiel

#hintergund {z-index:0;}
#menu {z-index:1;}

2. Falls es das nicht ist: es gab in letzter Zeit mehrere Threads über Probleme mit dem "Aufklapp-Menü" ... schau doch mal, ob einer davon dir weiterhilft.

sommersprosse · Post by **sommersprosse** » Tue Jun 02, 2009 9:11 am

ottyscom wrote: Habe auf einer CMS Seite oben eine CSS Menu Leiste Horizontal mit aufklapbaren Menues. Nur wenn man diese aufklappt verschwinden die hinter dem Content Kasten.

Leider gibst du etwas wenig Info, es könnte auch von Bedeutung sein was für ein Element bzw. welcher Teil des Contents dein Menü überlappt.
Wenn du uns einem Link mit Beispiel gibst können wir dir bestimmt mehr Tipps geben.

excalibur77 · Post by **excalibur77** » Wed Jun 03, 2009 10:58 am

In der Regl lassen sich solche Probleme mit einem hohen z-inex wie 999999 für das Menü-Div beheben, ggf. mit einem position:relative; - letzteres natürlich mit Vorsicht, kenne Dein CSS nicht.

Hast Du evtl. ein Flash im Content? Dann wmode auf transparent setzen.

Übrigens mal kurz ein freundliches Hallo an alle die mich noch kennen, hatte in den letzten Monaten sauwenig Zeit für's Forum und freue mich über viele neue Infos.

Edit: wie in PN geschrieben, die ul's des Menüs auch auf hohen z-index!

NaN · Post by **NaN** » Wed Jun 03, 2009 11:14 am

Vielleicht wäre es besser, wenn Du mal den Ausschnitt aus Deinem Template / CSS postest.
Sonst kann man hier wirklich nur Vermutungen anstellen.

ottyscom · Post by **ottyscom** » Mon Jun 08, 2009 11:25 am

Hier ist der CSS Code. Muss ihn in 3 Teile Posten da sonst die maximale lánge erreicht wird:

TEIL1:

Code: Select all

body
{
  margin: 0 auto;
  padding: 0;
  background-color: #FCFCFD;
  background-image: url('images/Page-BgTexture.jpg');
  background-repeat: repeat-x;
  background-attachment: fixed;
  background-position: bottom left;
}

.Main
{
  position: absolute;
  width: 100%;
  left: 0;
  top: 0;
}





.cleared
{
  float: none;
  clear: both;
  margin: 0;
  padding: 0;
  border: none;
  font-size:1px;
}


/* end Page */

/* begin Box, Sheet */
.Sheet
{
  overflow: hidden;
  min-width:51px;
  min-height:51px;
  margin: 0 auto;
  position: relative;
  z-index: 1;
  width: 900px;
}


.Sheet-body
{
  position: relative;
  z-index: 0;
  margin: 5px;
}

.Sheet-tl
{
  position: absolute;
  overflow: hidden;
  z-index: -1;
  top: 0;
  left: 0;
  width: 35px;
  height: 35px;
  background-image: url('images/Sheet-s.png');
}

.Sheet-tr
{
  position: absolute;
  overflow: hidden;
  z-index: -1;
  top: 0;
  right: 0;
  width: 35px;
  height: 35px;
}

.Sheet-tr div
{
  position: absolute;
  z-index: -1;
  top: 0px;
  left: -35px;
  width: 70px;
  height: 70px;
  background-image: url('images/Sheet-s.png');
}

.Sheet-bl
{
  position: absolute;
  overflow: hidden;
  z-index: -1;
  bottom: 0;
  left: 0;
  width: 35px;
  height: 35px;
}

.Sheet-bl div
{
  position: absolute;
  z-index: -1;
  top: -35px;
  left: 0;
  width: 70px;
  height: 70px;
  background-image: url('images/Sheet-s.png');
}

.Sheet-br
{
  position: absolute;
  overflow: hidden;
  z-index: -1;
  bottom: 0;
  right: 0;
  width: 35px;
  height: 35px;
}

.Sheet-br div
{
  position: absolute;
  z-index: -1;
  top: -35px;
  left: -35px;
  width: 70px;
  height: 70px;
  background-image: url('images/Sheet-s.png');
}

.Sheet-tc
{
  position: absolute;
  overflow:hidden;
  z-index: -1;
  top: 0;
  left: 35px;
  right: 35px;
  height: 35px;
}

.Sheet-tc div
{
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 70px;
  background-image: url('images/Sheet-h.png');
}

.Sheet-bc
{
  position: absolute;
  overflow:hidden;
  z-index: -1;
  bottom: 0;
  left: 35px;
  right: 35px;
  height: 35px;
}

.Sheet-bc div
{
  position: absolute;
  z-index: -1;
  top: -35px;
  left: 0;
  width: 100%;
  height: 70px;
  background-image: url('images/Sheet-h.png');
}

.Sheet-cl
{
  position: absolute;
  overflow:hidden;
  z-index: -1;
  top: 35px;
  left: 0;
  width: 35px;
  bottom: 35px;
}

.Sheet-cl div
{
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 70px;
  height: 100%;
  background-image: url('images/Sheet-v.png');
}

.Sheet-cr
{
  position: absolute;
  overflow:hidden;
  z-index: -1;
  top: 35px;
  right: 0;
  width: 35px;
  bottom: 35px;
}

.Sheet-cr div
{
  position: absolute;
  z-index: -1;
  top: 0;
  left: -35px;
  width: 70px;
  height: 100%;
  background-image: url('images/Sheet-v.png');
}

.Sheet-cc
{
  position: absolute;
  overflow:hidden;
  z-index: -2;
  top: 35px;
  left: 35px;
  right: 35px;
  bottom: 35px;
  background-image: url('images/Sheet-c.png');
}


.Sheet
{
  margin-top: 30px !important;
}
/* end Box, Sheet */

/* begin Header */
div.Header
{
  margin: 0 auto;
  position: relative;
  z-index:0;
  width: 890px;
  height: 225px;
}

div.Header-png
{
  position: absolute;
  z-index:-2;
  top: 0;
  left: 0;
  width: 890px;
  height: 225px;
  background-image: url('images/Header.png');
  background-repeat: no-repeat;
  background-position: left top;
}


div.Header-jpeg
{
  position: absolute;
  z-index:-1;
  top: 0;
  left: 0;
  width: 890px;
  height: 225px;
  background-image: url('images/Header.jpg');
  background-repeat: no-repeat;
  background-position: center center;
}
/* end Header */

/* begin Logo */
.logo
{
  display : block;
  position: absolute;
  left: {LogoLeft}px;
  top: {LogoTop}px;
  width: {LogoWidth}px;
}

h1.logo-name
{
  display: block;
  text-align: {HorizontalAlign};
}

h1.logo-name, h1.logo-name a, h1.logo-name a:link, h1.logo-name a:visited, h1.logo-name a:hover
{
{LogoNameFont}
  padding:0;
  margin:0;
  color: {NameFontColor} !important;
}

.logo-text
{
  display: block;
  text-align: {HorizontalAlign};
}

.logo-text, .logo-text a
{
{LogoSloganFont}
  padding:0;
  margin:0;
  color: {TextFontColor} !important;
}

/* end Logo */









/* begin ContentLayout */
.contentLayout
{
  margin-bottom: 5px;
  width: 890px;
  position: relative;
}
/* end ContentLayout */

/* begin Box, Block */
.Block
{
  overflow: hidden;
  min-width:15px;
  min-height:15px;
  margin: 0 auto;
  position: relative;
  z-index: 0;
}


.Block-body
{
  position: relative;
  z-index: 0;
  margin: 7px;
}

.Block-tl
{
  position: absolute;
  overflow: hidden;
  z-index: -1;
  top: 0;
  left: 0;
  width: 7px;
  height: 7px;
  background-image: url('images/Block-s.png');
}

.Block-tr
{
  position: absolute;
  overflow: hidden;
  z-index: -1;
  top: 0;
  right: 0;
  width: 7px;
  height: 7px;
}

.Block-tr div
{
  position: absolute;
  z-index: -1;
  top: 0px;
  left: -7px;
  width: 14px;
  height: 14px;
  background-image: url('images/Block-s.png');
}

.Block-bl
{
  position: absolute;
  overflow: hidden;
  z-index: -1;
  bottom: 0;
  left: 0;
  width: 7px;
  height: 7px;
}

.Block-bl div
{
  position: absolute;
  z-index: -1;
  top: -7px;
  left: 0;
  width: 14px;
  height: 14px;
  background-image: url('images/Block-s.png');
}

.Block-br
{
  position: absolute;
  overflow: hidden;
  z-index: -1;
  bottom: 0;
  right: 0;
  width: 7px;
  height: 7px;
}

.Block-br div
{
  position: absolute;
  z-index: -1;
  top: -7px;
  left: -7px;
  width: 14px;
  height: 14px;
  background-image: url('images/Block-s.png');
}

.Block-tc
{
  position: absolute;
  overflow:hidden;
  z-index: -1;
  top: 0;
  left: 7px;
  right: 7px;
  height: 7px;
}

.Block-tc div
{
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 14px;
  background-image: url('images/Block-h.png');
}

.Block-bc
{
  position: absolute;
  overflow:hidden;
  z-index: -1;
  bottom: 0;
  left: 7px;
  right: 7px;
  height: 7px;
}

.Block-bc div
{
  position: absolute;
  z-index: -1;
  top: -7px;
  left: 0;
  width: 100%;
  height: 14px;
  background-image: url('images/Block-h.png');
}

.Block-cl
{
  position: absolute;
  overflow:hidden;
  z-index: -1;
  top: 7px;
  left: 0;
  width: 7px;
  bottom: 7px;
}

.Block-cl div
{
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 14px;
  height: 100%;
  background-image: url('images/Block-v.png');
}

.Block-cr
{
  position: absolute;
  overflow:hidden;
  z-index: -1;
  top: 7px;
  right: 0;
  width: 7px;
  bottom: 7px;
}

.Block-cr div
{
  position: absolute;
  z-index: -1;
  top: 0;
  left: -7px;
  width: 14px;
  height: 100%;
  background-image: url('images/Block-v.png');
}

.Block-cc
{
  position: absolute;
  overflow:hidden;
  z-index: -2;
  top: 7px;
  left: 7px;
  right: 7px;
  bottom: 7px;
  background-image: url('images/Block-c.png');
}


.Block
{
  margin: 7px;
}

/* end Box, Block */

/* begin BlockHeader */
.BlockHeader
{
  position: relative;
  overflow: hidden;
  height: 30px;
  z-index: 0;
  line-height: 30px;
  padding: 0 7px;
  margin-bottom: 7px;

}

.BlockHeader-text
{
  white-space : nowrap;
  color: #000000;
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 12px;
  font-style: normal;
  font-weight: bold;
  line-height: 30px;
  
}


.BlockHeader .l, .BlockHeader .r, .BlockHeader .r div
{
  top: 0;
  position: absolute;
  z-index: -1;
  overflow: hidden;
  height: 30px;
}

.BlockHeader .l
{
  left: 0;
  right: 6px;
}


.BlockHeader .r
{
  right: 0;
  width: 6px;
}


.BlockHeader .r div
{
  width: 890px;
  right: 0;
}


.BlockHeader .l, .BlockHeader .r div
{
  background-position: left top;
  background-repeat: no-repeat;
  background-image: url('images/BlockHeader.png');
}



.header-tag-icon
{
  display:inline-block;
  background-position:left top;
  background-image: url('images/BlockHeaderIcon.png');
  padding:0 0 0 30px;
  background-repeat: no-repeat;
  min-height: 14px;
  margin: 0 0 0 5px;
}




/* end BlockHeader */

/* begin Box, BlockContent */
.BlockContent
{
  overflow: hidden;
  min-width:1px;
  min-height:1px;
  margin: 0 auto;
  position: relative;
  z-index: 0;
}


.BlockContent-body
{
  position: relative;
  z-index: 0;
  margin:8px;
}


.BlockContent-body
{
  color:#162032;
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 12px;
  font-style: normal;
  font-weight: normal;
}

.BlockContent-body a:link
{
  color: #30486E;
  font-family: Arial, Helvetica, Sans-Serif;
  text-decoration: underline;
}

.BlockContent-body a:visited, .BlockContent-body a.visited
{
  color: #867C8D;
  font-family: Arial, Helvetica, Sans-Serif;
  text-decoration: underline;
}

.BlockContent-body a:hover, .BlockContent-body a.hover
{
  color: #D16200;
  font-family: Arial, Helvetica, Sans-Serif;
  text-decoration: none;
}


.BlockContent-body ul
{
  list-style-type: none;
  color: #363239;
  margin:0;
  padding:0;
}

.BlockContent-body li
{
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 12px;
  text-decoration: none;
}

.BlockContent-body ul li
{
  padding:0px 0 0px 13px;
  background-image: url('images/BlockContentBullets.png');
  background-repeat:no-repeat;
  margin:0.5em 0 0.5em 0;
  line-height:1.2em;
}

/* end Box, BlockContent */

ottyscom · Post by **ottyscom** » Mon Jun 08, 2009 11:28 am

TEIL 2:

Code: Select all

/* begin Box, Post */
.Post
{
  overflow: hidden;
  min-width:17px;
  min-height:17px;
  margin: 0 auto;
  position: relative;
  z-index: 0;
}


.Post-body
{
  position: relative;
  z-index: 0;
  margin: 12px;
}

.Post-tl
{
  position: absolute;
  overflow: hidden;
  z-index: -1;
  top: 0;
  left: 0;
  width: 12px;
  height: 12px;
  background-image: url('images/Post-s.png');
}

.Post-tr
{
  position: absolute;
  overflow: hidden;
  z-index: -1;
  top: 0;
  right: 0;
  width: 12px;
  height: 12px;
}

.Post-tr div
{
  position: absolute;
  z-index: -1;
  top: 0px;
  left: -12px;
  width: 24px;
  height: 24px;
  background-image: url('images/Post-s.png');
}

.Post-bl
{
  position: absolute;
  overflow: hidden;
  z-index: -1;
  bottom: 0;
  left: 0;
  width: 12px;
  height: 12px;
}

.Post-bl div
{
  position: absolute;
  z-index: -1;
  top: -12px;
  left: 0;
  width: 24px;
  height: 24px;
  background-image: url('images/Post-s.png');
}

.Post-br
{
  position: absolute;
  overflow: hidden;
  z-index: -1;
  bottom: 0;
  right: 0;
  width: 12px;
  height: 12px;
}

.Post-br div
{
  position: absolute;
  z-index: -1;
  top: -12px;
  left: -12px;
  width: 24px;
  height: 24px;
  background-image: url('images/Post-s.png');
}

.Post-tc
{
  position: absolute;
  overflow:hidden;
  z-index: -1;
  top: 0;
  left: 12px;
  right: 12px;
  height: 12px;
}

.Post-tc div
{
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 24px;
  background-image: url('images/Post-h.png');
}

.Post-bc
{
  position: absolute;
  overflow:hidden;
  z-index: -1;
  bottom: 0;
  left: 12px;
  right: 12px;
  height: 12px;
}

.Post-bc div
{
  position: absolute;
  z-index: -1;
  top: -12px;
  left: 0;
  width: 100%;
  height: 24px;
  background-image: url('images/Post-h.png');
}

.Post-cl
{
  position: absolute;
  overflow:hidden;
  z-index: -1;
  top: 12px;
  left: 0;
  width: 12px;
  bottom: 12px;
}

.Post-cl div
{
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 24px;
  height: 100%;
  background-image: url('images/Post-v.png');
}

.Post-cr
{
  position: absolute;
  overflow:hidden;
  z-index: -1;
  top: 12px;
  right: 0;
  width: 12px;
  bottom: 12px;
}

.Post-cr div
{
  position: absolute;
  z-index: -1;
  top: 0;
  left: -12px;
  width: 24px;
  height: 100%;
  background-image: url('images/Post-v.png');
}

.Post-cc
{
  position: absolute;
  overflow:hidden;
  z-index: -2;
  top: 12px;
  left: 12px;
  right: 12px;
  bottom: 12px;
  background-image: url('images/Post-c.png');
}


.Post
{
  margin: 10px;
}


/* Start images */
a img
{
  border: 0;
}

.article img, img.article
{
  border-style: solid;
  border-width: 0px;
  border-color: #91A9CF;
  margin: 1em;
}

.metadata-icons img
{
  border: none;
  vertical-align: middle;
  margin:2px;
}
/* Finish images */

/* Start tables */

.article table, table.article
{
  border-collapse: collapse;
  margin: 1px;
  width:auto;
}

.article table, table.article .article tr, .article th, .article td
{
  background-color:Transparent;
}

.article th, .article td
{
  padding: 2px;
  border: solid 1px #988F9E;
  vertical-align: top;
  text-align:left;
}

.article th
{
  text-align:center;
  vertical-align:middle;
  padding: 7px;
}



/* Finish tables */
/* end Box, Post */

/* begin PostHeaderIcon */
.PostHeaderIcon-wrapper
{
  text-decoration:none;
  margin: 0.2em 0;
  padding: 0;
  font-weight:normal;
  font-style:normal;
  letter-spacing:normal;
  word-spacing:normal;
  font-variant:normal;
  text-decoration:none;
  font-variant:normal;
  text-transform:none;
  text-align:left;
  text-indent:0;
  line-height:inherit;
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 22px;
  font-style: normal;
  font-weight: bold;
  text-align: left;
  color: #22334E;
}

.PostHeaderIcon-wrapper, .PostHeaderIcon-wrapper a, .PostHeaderIcon-wrapper a:link, .PostHeaderIcon-wrapper a:visited, .PostHeaderIcon-wrapper a:hover
{
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 22px;
  font-style: normal;
  font-weight: bold;
  text-align: left;
  color: #22334E;
}

/* end PostHeaderIcon */

/* begin PostHeader */
.PostHeader a:link
{
  font-family: Arial, Helvetica, Sans-Serif;
  text-decoration: none;
  text-align: left;
  color: #2A3F60;
}

.PostHeader a:visited, .PostHeader a.visited
{
  font-family: Arial, Helvetica, Sans-Serif;
  text-decoration: none;
  text-align: left;
  color: #46404A;
}

.PostHeader a:hover, .PostHeader a.hovered
{
  font-family: Arial, Helvetica, Sans-Serif;
  text-decoration: none;
  text-align: left;
  color: #101723;
}
/* end PostHeader */

/* begin PostContent */
/* Content Text Font & Color (Default) */
body
{
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 12px;
  font-style: normal;
  font-weight: normal;
  color: #000000;
}

.PostContent
{
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 12px;
  font-style: normal;
  font-weight: normal;
  text-align: justify;
  color: #000000;
}

/* Start Content link style */
/*
The right order of link pseudo-classes: Link-Visited-Hover-Focus-Active.
http://www.w3schools.com/CSS/css_pseudo_classes.asp
http://meyerweb.com/eric/thoughts/2007/06/11/who-ordered-the-link-states/
*/
a
{
  font-family: Arial, Helvetica, Sans-Serif;
  text-decoration: underline;
  color: #5C7FB7;
}

/* Adds special style to an unvisited link. */
a:link
{
  font-family: Arial, Helvetica, Sans-Serif;
  text-decoration: underline;
  color: #5C7FB7;
}

/* Adds special style to a visited link. */
a:visited, a.visited
{
  font-family: Arial, Helvetica, Sans-Serif;
  text-decoration: underline;
  color: #FF8214;
}

/* :hover - adds special style to an element when you mouse over it. */
a:hover, a.hover
{
  font-family: Arial, Helvetica, Sans-Serif;
  font-style: normal;
  font-weight: bold;
  text-decoration: none;
  color: #1A181B;
}

/* Finish Content link style */

/* Resert some headings default style & links default style for links in headings*/
h1, h2, h3, h4, h5, h6,
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover
h1 a:visited, h2 a:visited, h3 a:visited, h4 a:visited, h5 a:visited, h6 a:visited
{
  font-weight: normal;
  font-style: normal;
  text-decoration: none;
}


/* Start Content headings Fonts & Colors  */
h1, h1 a, h1 a:link, h1 a:visited, h1 a:hover
{
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 28px;
  font-style: normal;
  font-weight: bold;
  text-align: left;
  color: #324A71;
}

h2, h2 a, h2 a:link, h2 a:visited, h2 a:hover
{
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 22px;
  font-style: normal;
  font-weight: bold;
  text-align: left;
  color: #436498;
}

h3, h3 a, h3 a:link, h3 a:visited, h3 a:hover
{
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 18px;
  font-style: normal;
  font-weight: bold;
  text-align: left;
  color: #534C57;
}

h4, h4 a, h4 a:link, h4 a:visited, h4 a:hover
{
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 16px;
  font-style: normal;
  font-weight: bold;
  text-align: left;
  color: #172335;
}

h5, h5 a, h5 a:link, h5 a:visited, h5 a:hover
{
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 14px;
  font-style: normal;
  font-weight: bold;
  text-align: left;
  color: #172335;
}

h6, h6 a, h6 a:link, h6 a:visited, h6 a:hover
{
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 14px;
  font-style: normal;
  font-weight: bold;
  text-align: left;
  color: #172335;
}
/* Finish Content headings Fonts & Colors  */

/* end PostContent */

/* begin PostBullets */
/* Start Content list */

ul
{
  list-style-type: none;
  color: #39343C;
  margin:0;
  padding:0;
}

li
{
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 12px;
}



.Post ul li
{
  padding:0px 0 0px 19px;
  background-image: url('images/PostBullets.png');
  background-repeat:no-repeat;
  margin:0.5em 0 0.5em 0;
  line-height:1.2em;
}


/* Finish Content list */
/* end PostBullets */

/* begin PostQuote */
/* Start blockquote */

blockquote p
{
  color:#312D34;
  font-family: Arial, Helvetica, Sans-Serif;
  font-style: italic;
  font-weight: normal;
  text-align: left;
}

blockquote
{
  border-color:#FFB06B;
  border-width: 0px;
  border-style: solid;

  margin:10px 10px 10px 50px;
  padding:5px 5px 5px 37px;

  background-color:#FFD6B3;

  background-image:url('images/PostQuote.png');
  background-position:left top;
  background-repeat:no-repeat;
}



/* Finish blockuote */
/* end PostQuote */

/* begin Button */
button.Button, a.Button
{
  position:relative;
  display:inline-block;
  width: auto;
  outline:none;
  border:none;
  background:none;
  line-height:34px;
  margin:0;
  padding:0;
  overflow: visible;
  cursor: default;
  text-decoration: none !important;
}


/*This HACK needed for ie7 (button position)*/
*:first-child+html button.Button, *:first-child+html a.Button
{
  display:list-item;
  list-style-type:none;
  float:left;
}


.Button .btn
{
  position: relative;
  overflow: hidden;
  display: block;
  width: auto;
  z-index: 0;
  height: 34px;
  color: #1C2A40;
  white-space: nowrap;
  float: left;
}

.Button .t
{
  height:34px;
  white-space: normal;
  padding: 0 21px;
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 12px;
  font-style: normal;
  font-weight: normal;
  text-align: left;
  line-height: 34px;
  text-decoration: none !important;
}

input, select
{
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 12px;
  font-style: normal;
  font-weight: normal;
}

.Button .active
{
  color: #EDECEE;
}

.Button .hover,  a.Button:hover
{
  color: #241100;
  text-decoration: none !important;
}

.Button .active .r
{
  top: -68px;
}

.Button .hover .r
{
  top: -34px;
}

.Button .r
{
  display: block;
  position: absolute;
  overflow: hidden;
  z-index: -1;
  top: 0;
  right: 0;
  width: 11px;
  height: 102px;
}


.Button .r span
{
  display: block;
  position: absolute;
  overflow: hidden;
  z-index: -1;
  top: 0;
  right: 0;
  width:411px;
  height: 102px;
}


.Button .active .l
{
  top: -68px;
}

.Button .hover .l
{
  top: -34px;
}

.Button .l
{
  display: block;
  position: absolute;
  overflow: hidden;
  z-index: -1;
  top: 0;
  left: 0;
  right: 11px;
  height: 102px;
}


.Button .l, .Button .r span
{
  background-image: url('images/Button.png');
}

/* end Button */

/* begin Footer */
.Footer
{
  position:relative;
  z-index:0;
  overflow:hidden;
  width: 890px;
  margin: 5px auto 0px auto;
}

.Footer .Footer-inner
{
  height:1%;
  position: relative;
  z-index: 0;
  padding: 8px;
  text-align: center;
}

.Footer .Footer-background
{
  position:absolute;
  z-index:-1;
  background-repeat:no-repeat;
  background-image: url('images/Footer.png');
  width: 890px;
  height: 100px;
  bottom:0;
  left:0;
}



.rss-tag-icon
{
  position: relative;
  display:block;
  float:left;
  background-image: url('images/rssIcon.png');
  background-position: center right;
  background-repeat: no-repeat;
  margin: 0 5px 0 0;
  height: 25px;
  width: 25px;
}




.Footer .Footer-text p
{
  margin: 0;
}

.Footer .Footer-text
{
  display:inline-block;
  color:#2C4163;
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 11px;
}

.Footer .Footer-text a:link
{
  text-decoration: none;
  color: #2F466A;
  font-family: Arial, Helvetica, Sans-Serif;
  text-decoration: underline;
}

.Footer .Footer-text a:visited
{
  text-decoration: none;
  color: #4E4752;
  font-family: Arial, Helvetica, Sans-Serif;
  text-decoration: underline;
}

.Footer .Footer-text a:hover
{
  text-decoration: none;
  color: #101723;
  font-family: Arial, Helvetica, Sans-Serif;
  text-decoration: none;
}
/* end Footer */

/* begin PageFooter */
.page-footer, .page-footer a, .page-footer a:link, .page-footer a:visited, .page-footer a:hover
{
  font-family:Arial;
  font-size:10px;
  letter-spacing:normal;
  word-spacing:normal;
  font-style:normal;
  font-weight:normal;
  text-decoration:underline;
  color:#86A0CA;
}

.page-footer
{
  margin:1em;
  text-align:center;
  text-decoration:none;
  color:#AAA2AE;
}
/* end PageFooter */

/* begin LayoutCell */
.contentLayout .sidebar1
{
  position: relative;
  margin: 0;
  padding: 0;
  border: 0;
  float: left;
  overflow: hidden;
  width: 222px;
}

/* end LayoutCell */

/* begin LayoutCell */
.contentLayout .content
{
  position: relative;
  margin: 0;
  padding: 0;
  border: 0;
  float: left;
  overflow: hidden;
  width: 445px;
}

/* end LayoutCell */

/* begin LayoutCell */
.contentLayout .sidebar2
{
  position: relative;
  margin: 0;
  padding: 0;
  border: 0;
  float: left;
  overflow: hidden;
  width: 222px;
}

/* end LayoutCell */

ottyscom · Post by **ottyscom** » Mon Jun 08, 2009 11:31 am

TEIL 3:

Code: Select all

/* Horizontal menu for the CMS CSS Menu Module */
/* by Alexander Endresen */

#menu_vert {
   margin-left: 1px;
   margin-right: 1px;
}

/* The wrapper clears the floating elements of the menu */

/* Fix for Opera 8 */
.clearb { clear: both; }
#menuwrapper { 
   /* Fix for Opera 8 */ 
   /*   overflow: hidden;  */ 
   background-color: #ECECEC;
   z-index: 99999;
   border-bottom: 1px solid #C0C0C0;
   width: 100%;
}

/* Set the width of the menu elements at second level. Leaving first level flexible. */
#primary-nav li li { 
   width: 200px; 
}






/* Unless you know what you do, do not touch this */ 
#primary-nav, #primary-nav ul { 
   list-style: none; 
  z-index: 99999;
   margin: 0px; 
   padding: 0px; 
}
#primary-nav ul { 
   position: absolute; 
   z-index: 99999;
   top: auto; 
   display: none; 
}
#primary-nav ul ul { 
   margin-top: 1px;
   margin-left: -1px;
   left: 100%; 
   top: 0px; 
}
	
#primary-nav li { 
   margin-left: -1px;
   z-index: 99999;
   float: left; 
}
#primary-nav li li { 
   margin-left: 0px;
   margin-top: -1px;
   float: none; 
   position: relative; 
   
}

/* Styling the basic apperance of the menu elements */
#primary-nav a { 
   display: block; 
   z-index: 99999;   
   margin: 0px; 
   padding: 5px 18px; 
   text-decoration: none; 
   font-weight:bold;
   color: #ffffff;
}
#primary-nav li a { 
   border-right: 1px solid #C0C0C0;
   border-left: 1px solid #C0C0C0;
}
#primary-nav li li a { 
   border: 1px solid #C0C0C0;
}	
#primary-nav li, #primary-nav li.menuparent { 
   background:#2c2c2c url(images/OTTYSCOM-RADIO03/nav.png);
   
}

/* Styling the basic apperance of the active page elements (shows what page in the menu is being displayed) */

#primary-nav li.menuactive { 
   background-color: #C7C7C7; 
}


/* Styling the basic apperance of the menuparents - here styled the same on hover (fixes IE bug) */
#primary-nav ul li.menuparent, 
#primary-nav ul li.menuparent:hover, 
#primary-nav ul li.menuparenth { 
/* arrow for menuparents */
   background-image: url(images/cms/arrow.gif); 
   background-position: center right; 
   background-repeat: no-repeat; 
   z-index: 99999;
}


/* Styling the apperance of menu items on hover */

#primary-nav li:hover, 
#primary-nav li.menuh, 
#primary-nav li.menuparenth, 
#primary-nav li.menuactiveh { 
   background:#000066 url(images/OTTYSCOM-RADIO03/nav_a.png); 
}


/* The magic - set to work for up to a 3 level menu, but can be increased unlimited */

/* 
just add 
#primary-nav li:hover ul ul, 
#primary-nav li.menuparenth ul ul ul,
for fourth level 
*/
#primary-nav ul, 
z-index: 99999;
#primary-nav li:hover ul, 
#primary-nav li:hover ul ul, 
#primary-nav li.menuparenth ul, 
#primary-nav li.menuparenth ul ul { 
   display: none; 
}

/* add 
#primary-nav ul ul ul li:hover ul, 
#primary-nav ul ul ul li.menuparenth ul,
for fourth level
*/
#primary-nav li:hover ul, 
#primary-nav ul li:hover ul, 
#primary-nav ul ul li:hover ul, 
#primary-nav li.menuparenth ul, 
#primary-nav ul li.menuparenth ul, 
#primary-nav ul ul li.menuparenth ul { 
   display: block; 
}


/* IE Hacks */
#primary-nav li li { 
   float: left; 
   clear: both; 
}
#primary-nav li li a { 
   height: 1%; 
}

ottyscom · Post by **ottyscom** » Mon Jun 08, 2009 11:36 am

TEIL 2:

Code: Select all

/* begin Box, Post */
.Post
{
  overflow: hidden;
  min-width:17px;
  min-height:17px;
  margin: 0 auto;
  position: relative;
  z-index: 0;
}


.Post-body
{
  position: relative;
  z-index: 0;
  margin: 12px;
}

.Post-tl
{
  position: absolute;
  overflow: hidden;
  z-index: -1;
  top: 0;
  left: 0;
  width: 12px;
  height: 12px;
  background-image: url('images/Post-s.png');
}

.Post-tr
{
  position: absolute;
  overflow: hidden;
  z-index: -1;
  top: 0;
  right: 0;
  width: 12px;
  height: 12px;
}

.Post-tr div
{
  position: absolute;
  z-index: -1;
  top: 0px;
  left: -12px;
  width: 24px;
  height: 24px;
  background-image: url('images/Post-s.png');
}

.Post-bl
{
  position: absolute;
  overflow: hidden;
  z-index: -1;
  bottom: 0;
  left: 0;
  width: 12px;
  height: 12px;
}

.Post-bl div
{
  position: absolute;
  z-index: -1;
  top: -12px;
  left: 0;
  width: 24px;
  height: 24px;
  background-image: url('images/Post-s.png');
}

.Post-br
{
  position: absolute;
  overflow: hidden;
  z-index: -1;
  bottom: 0;
  right: 0;
  width: 12px;
  height: 12px;
}

.Post-br div
{
  position: absolute;
  z-index: -1;
  top: -12px;
  left: -12px;
  width: 24px;
  height: 24px;
  background-image: url('images/Post-s.png');
}

.Post-tc
{
  position: absolute;
  overflow:hidden;
  z-index: -1;
  top: 0;
  left: 12px;
  right: 12px;
  height: 12px;
}

.Post-tc div
{
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 100%;
  height: 24px;
  background-image: url('images/Post-h.png');
}

.Post-bc
{
  position: absolute;
  overflow:hidden;
  z-index: -1;
  bottom: 0;
  left: 12px;
  right: 12px;
  height: 12px;
}

.Post-bc div
{
  position: absolute;
  z-index: -1;
  top: -12px;
  left: 0;
  width: 100%;
  height: 24px;
  background-image: url('images/Post-h.png');
}

.Post-cl
{
  position: absolute;
  overflow:hidden;
  z-index: -1;
  top: 12px;
  left: 0;
  width: 12px;
  bottom: 12px;
}

.Post-cl div
{
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 24px;
  height: 100%;
  background-image: url('images/Post-v.png');
}

.Post-cr
{
  position: absolute;
  overflow:hidden;
  z-index: -1;
  top: 12px;
  right: 0;
  width: 12px;
  bottom: 12px;
}

.Post-cr div
{
  position: absolute;
  z-index: -1;
  top: 0;
  left: -12px;
  width: 24px;
  height: 100%;
  background-image: url('images/Post-v.png');
}

.Post-cc
{
  position: absolute;
  overflow:hidden;
  z-index: -2;
  top: 12px;
  left: 12px;
  right: 12px;
  bottom: 12px;
  background-image: url('images/Post-c.png');
}


.Post
{
  margin: 10px;
}


/* Start images */
a img
{
  border: 0;
}

.article img, img.article
{
  border-style: solid;
  border-width: 0px;
  border-color: #91A9CF;
  margin: 1em;
}

.metadata-icons img
{
  border: none;
  vertical-align: middle;
  margin:2px;
}
/* Finish images */

/* Start tables */

.article table, table.article
{
  border-collapse: collapse;
  margin: 1px;
  width:auto;
}

.article table, table.article .article tr, .article th, .article td
{
  background-color:Transparent;
}

.article th, .article td
{
  padding: 2px;
  border: solid 1px #988F9E;
  vertical-align: top;
  text-align:left;
}

.article th
{
  text-align:center;
  vertical-align:middle;
  padding: 7px;
}



/* Finish tables */
/* end Box, Post */

/* begin PostHeaderIcon */
.PostHeaderIcon-wrapper
{
  text-decoration:none;
  margin: 0.2em 0;
  padding: 0;
  font-weight:normal;
  font-style:normal;
  letter-spacing:normal;
  word-spacing:normal;
  font-variant:normal;
  text-decoration:none;
  font-variant:normal;
  text-transform:none;
  text-align:left;
  text-indent:0;
  line-height:inherit;
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 22px;
  font-style: normal;
  font-weight: bold;
  text-align: left;
  color: #22334E;
}

.PostHeaderIcon-wrapper, .PostHeaderIcon-wrapper a, .PostHeaderIcon-wrapper a:link, .PostHeaderIcon-wrapper a:visited, .PostHeaderIcon-wrapper a:hover
{
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 22px;
  font-style: normal;
  font-weight: bold;
  text-align: left;
  color: #22334E;
}

/* end PostHeaderIcon */

/* begin PostHeader */
.PostHeader a:link
{
  font-family: Arial, Helvetica, Sans-Serif;
  text-decoration: none;
  text-align: left;
  color: #2A3F60;
}

.PostHeader a:visited, .PostHeader a.visited
{
  font-family: Arial, Helvetica, Sans-Serif;
  text-decoration: none;
  text-align: left;
  color: #46404A;
}

.PostHeader a:hover, .PostHeader a.hovered
{
  font-family: Arial, Helvetica, Sans-Serif;
  text-decoration: none;
  text-align: left;
  color: #101723;
}
/* end PostHeader */

/* begin PostContent */
/* Content Text Font & Color (Default) */
body
{
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 12px;
  font-style: normal;
  font-weight: normal;
  color: #000000;
}

.PostContent
{
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 12px;
  font-style: normal;
  font-weight: normal;
  text-align: justify;
  color: #000000;
}

/* Start Content link style */
/*
The right order of link pseudo-classes: Link-Visited-Hover-Focus-Active.
http://www.w3schools.com/CSS/css_pseudo_classes.asp
http://meyerweb.com/eric/thoughts/2007/06/11/who-ordered-the-link-states/
*/
a
{
  font-family: Arial, Helvetica, Sans-Serif;
  text-decoration: underline;
  color: #5C7FB7;
}

/* Adds special style to an unvisited link. */
a:link
{
  font-family: Arial, Helvetica, Sans-Serif;
  text-decoration: underline;
  color: #5C7FB7;
}

/* Adds special style to a visited link. */
a:visited, a.visited
{
  font-family: Arial, Helvetica, Sans-Serif;
  text-decoration: underline;
  color: #FF8214;
}

/* :hover - adds special style to an element when you mouse over it. */
a:hover, a.hover
{
  font-family: Arial, Helvetica, Sans-Serif;
  font-style: normal;
  font-weight: bold;
  text-decoration: none;
  color: #1A181B;
}

/* Finish Content link style */

/* Resert some headings default style & links default style for links in headings*/
h1, h2, h3, h4, h5, h6,
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a
h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover
h1 a:visited, h2 a:visited, h3 a:visited, h4 a:visited, h5 a:visited, h6 a:visited
{
  font-weight: normal;
  font-style: normal;
  text-decoration: none;
}


/* Start Content headings Fonts & Colors  */
h1, h1 a, h1 a:link, h1 a:visited, h1 a:hover
{
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 28px;
  font-style: normal;
  font-weight: bold;
  text-align: left;
  color: #324A71;
}

h2, h2 a, h2 a:link, h2 a:visited, h2 a:hover
{
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 22px;
  font-style: normal;
  font-weight: bold;
  text-align: left;
  color: #436498;
}

h3, h3 a, h3 a:link, h3 a:visited, h3 a:hover
{
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 18px;
  font-style: normal;
  font-weight: bold;
  text-align: left;
  color: #534C57;
}

h4, h4 a, h4 a:link, h4 a:visited, h4 a:hover
{
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 16px;
  font-style: normal;
  font-weight: bold;
  text-align: left;
  color: #172335;
}

h5, h5 a, h5 a:link, h5 a:visited, h5 a:hover
{
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 14px;
  font-style: normal;
  font-weight: bold;
  text-align: left;
  color: #172335;
}

h6, h6 a, h6 a:link, h6 a:visited, h6 a:hover
{
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 14px;
  font-style: normal;
  font-weight: bold;
  text-align: left;
  color: #172335;
}
/* Finish Content headings Fonts & Colors  */

/* end PostContent */

/* begin PostBullets */
/* Start Content list */

ul
{
  list-style-type: none;
  color: #39343C;
  margin:0;
  padding:0;
}

li
{
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 12px;
}



.Post ul li
{
  padding:0px 0 0px 19px;
  background-image: url('images/PostBullets.png');
  background-repeat:no-repeat;
  margin:0.5em 0 0.5em 0;
  line-height:1.2em;
}


/* Finish Content list */
/* end PostBullets */

/* begin PostQuote */
/* Start blockquote */

blockquote p
{
  color:#312D34;
  font-family: Arial, Helvetica, Sans-Serif;
  font-style: italic;
  font-weight: normal;
  text-align: left;
}

blockquote
{
  border-color:#FFB06B;
  border-width: 0px;
  border-style: solid;

  margin:10px 10px 10px 50px;
  padding:5px 5px 5px 37px;

  background-color:#FFD6B3;

  background-image:url('images/PostQuote.png');
  background-position:left top;
  background-repeat:no-repeat;
}



/* Finish blockuote */
/* end PostQuote */

/* begin Button */
button.Button, a.Button
{
  position:relative;
  display:inline-block;
  width: auto;
  outline:none;
  border:none;
  background:none;
  line-height:34px;
  margin:0;
  padding:0;
  overflow: visible;
  cursor: default;
  text-decoration: none !important;
}


/*This HACK needed for ie7 (button position)*/
*:first-child+html button.Button, *:first-child+html a.Button
{
  display:list-item;
  list-style-type:none;
  float:left;
}


.Button .btn
{
  position: relative;
  overflow: hidden;
  display: block;
  width: auto;
  z-index: 0;
  height: 34px;
  color: #1C2A40;
  white-space: nowrap;
  float: left;
}

.Button .t
{
  height:34px;
  white-space: normal;
  padding: 0 21px;
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 12px;
  font-style: normal;
  font-weight: normal;
  text-align: left;
  line-height: 34px;
  text-decoration: none !important;
}

input, select
{
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 12px;
  font-style: normal;
  font-weight: normal;
}

.Button .active
{
  color: #EDECEE;
}

.Button .hover,  a.Button:hover
{
  color: #241100;
  text-decoration: none !important;
}

.Button .active .r
{
  top: -68px;
}

.Button .hover .r
{
  top: -34px;
}

.Button .r
{
  display: block;
  position: absolute;
  overflow: hidden;
  z-index: -1;
  top: 0;
  right: 0;
  width: 11px;
  height: 102px;
}


.Button .r span
{
  display: block;
  position: absolute;
  overflow: hidden;
  z-index: -1;
  top: 0;
  right: 0;
  width:411px;
  height: 102px;
}


.Button .active .l
{
  top: -68px;
}

.Button .hover .l
{
  top: -34px;
}

.Button .l
{
  display: block;
  position: absolute;
  overflow: hidden;
  z-index: -1;
  top: 0;
  left: 0;
  right: 11px;
  height: 102px;
}


.Button .l, .Button .r span
{
  background-image: url('images/Button.png');
}

/* end Button */

/* begin Footer */
.Footer
{
  position:relative;
  z-index:0;
  overflow:hidden;
  width: 890px;
  margin: 5px auto 0px auto;
}

.Footer .Footer-inner
{
  height:1%;
  position: relative;
  z-index: 0;
  padding: 8px;
  text-align: center;
}

.Footer .Footer-background
{
  position:absolute;
  z-index:-1;
  background-repeat:no-repeat;
  background-image: url('images/Footer.png');
  width: 890px;
  height: 100px;
  bottom:0;
  left:0;
}



.rss-tag-icon
{
  position: relative;
  display:block;
  float:left;
  background-image: url('images/rssIcon.png');
  background-position: center right;
  background-repeat: no-repeat;
  margin: 0 5px 0 0;
  height: 25px;
  width: 25px;
}




.Footer .Footer-text p
{
  margin: 0;
}

.Footer .Footer-text
{
  display:inline-block;
  color:#2C4163;
  font-family: Arial, Helvetica, Sans-Serif;
  font-size: 11px;
}

.Footer .Footer-text a:link
{
  text-decoration: none;
  color: #2F466A;
  font-family: Arial, Helvetica, Sans-Serif;
  text-decoration: underline;
}

.Footer .Footer-text a:visited
{
  text-decoration: none;
  color: #4E4752;
  font-family: Arial, Helvetica, Sans-Serif;
  text-decoration: underline;
}

.Footer .Footer-text a:hover
{
  text-decoration: none;
  color: #101723;
  font-family: Arial, Helvetica, Sans-Serif;
  text-decoration: none;
}
/* end Footer */

/* begin PageFooter */
.page-footer, .page-footer a, .page-footer a:link, .page-footer a:visited, .page-footer a:hover
{
  font-family:Arial;
  font-size:10px;
  letter-spacing:normal;
  word-spacing:normal;
  font-style:normal;
  font-weight:normal;
  text-decoration:underline;
  color:#86A0CA;
}

.page-footer
{
  margin:1em;
  text-align:center;
  text-decoration:none;
  color:#AAA2AE;
}
/* end PageFooter */

/* begin LayoutCell */
.contentLayout .sidebar1
{
  position: relative;
  margin: 0;
  padding: 0;
  border: 0;
  float: left;
  overflow: hidden;
  width: 222px;
}

/* end LayoutCell */

/* begin LayoutCell */
.contentLayout .content
{
  position: relative;
  margin: 0;
  padding: 0;
  border: 0;
  float: left;
  overflow: hidden;
  width: 445px;
}

/* end LayoutCell */

/* begin LayoutCell */
.contentLayout .sidebar2
{
  position: relative;
  margin: 0;
  padding: 0;
  border: 0;
  float: left;
  overflow: hidden;
  width: 222px;
}

/* end LayoutCell */

NaN · Post by **NaN** » Mon Jun 08, 2009 4:20 pm

Sorry, hier ist leider nur der 3. Teil Deines Monster Posts angekommen.
Ohne Markup hilft das Fragment leider nicht weiter.
Außerdem, sagte ich

NaN wrote: [...]
den Ausschnitt aus Deinem Template / CSS postest.
[...]

Nicht die komplette Seite.
Das liest sich doch sonst kein Mensch durch.
Hast Du mal nen Link zum Anschauen?

ottyscom · Post by **ottyscom** » Tue Jun 09, 2009 9:39 am

Hi,

Habe Dir den Link sobene per PN gesendet.

Habe schon viel mit dem Z-index rumgespielt aber leider immeer noch kein positives Ergebnis erzielt

Danke

uniqu3 · Post by **uniqu3** » Tue Jun 09, 2009 11:21 am

achte doch auf position:absolute oder relative; etc. aus deinem CSS ist nicht einfach einen durchblick zu finden ohne den restlichen Markup.

NaN · Post by **NaN** » Wed Jun 10, 2009 10:32 am

Ein kleiner "Fehler" im Stylesheet.
Schau mal in Teil 1 Deiner Stylesheets:

.Sheet-body
{
position: relative;
z-index: 0;
margin: 5px;
}

Da dieser Div unter anderem auch das Menü enthält, aber den Index Null hat, kannst Du für das Menü einen Index definieren wie Du willst, es hat keinerlei Auswirkungen auf den Rest des Layouts.
Es wirkt nur innerhalb des .Sheet-body-Divs.
Also die Angabe für z-index an dieser Stelle rausnehmen.
Dann sollte alles okay sein.
Evtl. dürftest Du Dir dann die anderen Angaben mit z-index sparen können.
Lediglich für

/* begin ContentLayout */
.contentLayout
{
margin-bottom: 5px;
width: 890px;
position: relative;
z-index:-1;
}
/* end ContentLayout */

bräuchtest Du einen negativen z-index, da dieser Bereich im Template erst nach dem Menü definiert wird.
(Ich habe mich jetzt allerdings nicht durch das komplette Layout durchgearbeitet. Könnte sein, dass die anderen z-index Angaben doch noch benötigt werden.)

Und dann würde ich soweit möglich die Seite noch etwas valider machen. (Sind nur kleine Fehler.)

CMS Made Simple Forums

CSS Horizontal Menu - Aufgeklappte Menues verschwinden hinter Content

CSS Horizontal Menu - Aufgeklappte Menues verschwinden hinter Content

Re: CSS Horizontal Menu - Aufgeklappte Menues verschwinden hinter Content

Re: CSS Horizontal Menu - Aufgeklappte Menues verschwinden hinter Content

Re: CSS Horizontal Menu - Aufgeklappte Menues verschwinden hinter Content

Re: CSS Horizontal Menu - Aufgeklappte Menues verschwinden hinter Content

Re: CSS Horizontal Menu - Aufgeklappte Menues verschwinden hinter Content

Re: CSS Horizontal Menu - Aufgeklappte Menues verschwinden hinter Content

Re: CSS Horizontal Menu - Aufgeklappte Menues verschwinden hinter Content

Re: CSS Horizontal Menu - Aufgeklappte Menues verschwinden hinter Content

Re: CSS Horizontal Menu - Aufgeklappte Menues verschwinden hinter Content

Re: CSS Horizontal Menu - Aufgeklappte Menues verschwinden hinter Content

Re: CSS Horizontal Menu - Aufgeklappte Menues verschwinden hinter Content

Re: CSS Horizontal Menu - Aufgeklappte Menues verschwinden hinter Content