Hallo,
ich habe ein großes Problem bei der Erstellung eines Seitenmenüs.
Und zwar habe ich ein CSS basierendes Menü erstellt, einen Marker an die Stelle gesetzt wo das Menü erscheinen soll und dann via TypoScript versucht den Marker anzusprechen. Dies scheint auch geklappt zu haben, allerdings ist von dem Menü weit und breit nichts zu sehen, ausser einem blauen Balken?



Hier mal meine Codes:

HTML-Code:
<title>Web Template</title>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>

<body>

    <!-- ###DOCUMENT_BODY### -->
<div id="header">
        <h2>Websitename</h2>
</div>
    <!-- header end -->    
    <!-- menu start -->
    <div id="topNav">
        <ul>
            <li><a href="index.html" title="Home Page" class="hover">Startseite</a></li>
            <li><a href="#" title="About Us">About</a></li>
            <li><a href="#" title="Company">Company</a></li>
            <li><a href="contact.html" title="Contact Us">Contact</a></li>
        </ul>
    </div>
    <!-- menu end -->
    <!-- body start -->
    <div id="body">
      <div class="left">
        ###INHALT###
        </div>
          
        <div class="right">
            <form method="post" action="#" name="search" class="search">
                <label>Search</label>
                <br class="spacer" />
                <input name="search" type="text" id="search" />
                <input name="" type="image" src="http://www.typo3forum.net/forum/images/search_btn.gif" title="Search"  class="searchBtn"/>
          </form>
            <br class="spacer" />
            <br class="spacer" />
          <h2><span>Navigation</span></h2>
          <br class="spacer" />
       
         <div id="navcontainer">
###NAVI###
</div>

         
        
    
            
            
      <br class="spacer" /></div>
        <br class="spacer" />
    </div>
    <!-- body end -->
    <!-- footer start -->
    <div id="footer">
        <div class="footer">
          <ul>
                <li><a href="http://****/" title="Startseite"> Home</a>|</li>
                <li><a href="#" title="Sitemap">Sitemap</a>|</li>
                <li><a href="#" title="Kontakt">Kontakt</a>|</li>
                <li><a href="contact.html" title="Contact Us">Impressum</a></li>
            </ul>
            <p></p>
            <br><br/>
            <p>2010 Company</p>
            <p class="signature">Designed by <a href="http://www.industrija.co.yu/cms/">Web Industry</a></p>
            <p class="valid"><a href="http://validator.w3.org/check?uri=referer" target="_blank" title="Valid XHTML" class="xhtml">XHTML</a> <a href="http://jigsaw.w3.org/css-validator/check/referer" target="_blank" title="Valid CSS" class="css">CSS</a></p><br class="spacer" />
        <br class="spacer" /></div>
    </div>
    
    <!-- ###DOCUMENT_BODY### -->        
</body>
</html>
Hier das TypoScript:

config.doctype = xhtml_trans
config.xhtml_cleaning = all
config.xmlprologue = none
config.pageTitleFirst = 1
content.RTE_compliant = 0
config.locale_all = de_DE
config.language = de
config.baseURL = http://***



# Default PAGE object:

temp.titel = TEXT
temp.titel.field = title

page = PAGE

page.meta{
keywords.field = keywords
keywords.ifEmpty (
***
)
description.field = description
description.ifEmpty (
Dies ist die Internetseite von ***.
)
robots = INDEX,FOLLOW
}


page {
config.index_enable = 1
typeNum = 0
stylesheet = fileadmin/template/style.css
meta.keywords.field = keywords
meta.description.field = description
meta.Robots = INDEX,FOLLOW

10 = TEMPLATE
10 {

template = FILE
relPathPrefix = fileadmin/
template.file = fileadmin/template/index.html
workOnSubpart = DOCUMENT_BODY
}

}


page.10.marks.INHALT < styles.content.get





page.10.marks.NAVI = HMENU
page.10.marks.NAVI {
wrap = <ul class="navcontainer"> | </ul>
special = directory
special.value = 2
entryLevel = 2
1 = TMENU
1.NO.linkWrap = <li> | </li>


}Und der CSS-Code:

Code:
/* CSS Document */
/* Web Industry */
body{
    background:url(images/bg.gif) repeat-x 0 0 #FFFFFF; color:#363636;
    font:normal 12px/18px Arial, Helvetica, sans-serif;
    margin:0; padding:0;}
div, h1, h2, h3, h4, h5, h6, form, label, input, span, ul, li, p, a{
    margin:0; padding:0;}
ul{
    list-style:none;}
.spacer{
    font-size:0; line-height:0; clear:both;}

/* -- header start -- */
#header{
    position:relative; margin:0 auto; width:828px; height:228px;
    background:url(images/header_bg.jpg) no-repeat 0 0 #337BA6; color:#000000;}
#header img{
    position:absolute; left:393px; top:30px; border:none;}
#header h1{
    position:absolute;
    left:397px;
    top:40px;
    border:none;
    font:bold 14px/16px  Verdana, Arial, Helvetica, sans-serif;
    color:#FFFFFF;
    width: 269px;
    height: 55px;
}
#header h2{
    position:absolute;
    left:407px;
    top:75px;
    border:none;
    font:bold 21px/24px  Verdana, Arial, Helvetica, sans-serif;
    color:#FFFFFF;
    width: 306px;
    height: 70px;
}
#header h3{
    position:absolute; left:197px; top:35px; border:none;
    font:bold 20px/22px  Verdana, Arial, Helvetica, sans-serif; color:#333333;}
#header h4{
    position:absolute; left:220px; top:55px; border:none;
    font:bold 14px/15px  Verdana, Arial, Helvetica, sans-serif; color:#666666;}
#header h5{
    position:absolute; left:170px; top:115px; border:none;
    font:bold 11px Arial, Helvetica, sans-serif; color:#666666; text-align:right;}
/* -- header end -- */
/* -- top navigation start -- */
#topNav{
    width:828px; height:30px; margin:0 auto;
    background:url(images/top_nav_bg.gif) no-repeat 0 0 #FFFFFF; color:#000000;}
#topNav ul{
    width:490px; margin:0 auto; }
#topNav ul li{
    float:left; margin:0 1px 0 0 ;}
#topNav ul li a{
    font:bold 11px/29px Arial, Helvetica, sans-serif; color:#595959;
    background:url(images/top_nav_btn_bg.gif) repeat-x 0 0 #FFFFFF;
    padding:0 12px; display:block; text-decoration:none;}
#topNav ul li a:hover{
    font:bold 11px/27px Arial, Helvetica, sans-serif; color:#337BA6;
    background-color:#FFFFFF; background-image:none;
    border-top:#DADADA 1px solid; border-right:#DADADA 1px solid; border-left:#DADADA 1px solid;
    padding:0 11px; margin:2px 0 0 0; display:block; text-decoration:none;}
#topNav ul li a.hover{
    font:bold 11px/27px Arial, Helvetica, sans-serif; color:#F50B04;
    background-color:#FFFFFF; background-image:none;
    border-top:#DADADA 1px solid; border-right:#DADADA 1px solid; border-left:#DADADA 1px solid;
    padding:0 11px; margin:2px 0 0 0; display:block; text-decoration:none;}
/* -- top navigation end -- */

/*        SideMenu    Start    */

#navcontainer
{
width: 12em;
border-right: 1px solid #000;
padding: 0 0 1em 0;
margin-bottom: 1em;
font-family: Verdana, Lucida, Geneva, Helvetica, Arial, sans-serif;
background-color: #90bade;
color: #333;
}

#navcontainer ul
{
list-style: none;
margin: 0;
padding: 0;
border: none;
}

#navcontainer li
{
border-bottom: 1px solid #90bade;
margin: 0;
}

#navcontainer li a
{
display: block;
padding: 5px 5px 5px 0.5em;
border-left: 10px solid #1958b7;
border-right: 10px solid #508fc4;
background-color: #2175bc;
color: #fff;
text-decoration: none;
width: 100%;
}

html>body #navcontainer li a { width: auto; }

#navcontainer li a:hover
{
border-left: 10px solid #1c64d1;
border-right: 10px solid #5ba3e0;
background-color: #2586d7;
color: #fff;
}


    /*        SideMenu Ende        */
    
/* body start */
#body{
    width:788px; margin:0 auto; padding:24px 0 49px 0;}
/* body end */
/* -- left pannel start -- */
.left{
    width:520px; float:right; padding:0 25px 0 0;}
.left img{
    border:none;}
.left h2{
    font:bold 20px/25px Arial, Helvetica, sans-serif; color:#337BA6;
    background-color:#FFFFFF; height:25px; width:200px; padding:0 0 10px 0; float:left;}
.left h2 span{
    font:bold 20px/25px  Arial, Helvetica, sans-serif; color:#F50B04;
    background-color:#FFFFFF; height:25px;}
.left span.dot{
    background:url(images/dot_line.gif) repeat-x 0 18px #FFFFFF;
    height:25px; width:280px; display:block; float:left; color:#000000;}
.left p{
    font:normal 12px/18px Arial, Helvetica, sans-serif; color:#363636; background-color:#FFFFFF; padding:0 0 12px 0;}
.left p span{
    font:normal 12px/18px Arial, Helvetica, sans-serif; color:#363636; background-color:#BFDEF7;}
.left p.dotLine{
    color:#363636; font-size:0; line-height:0; height:13px; padding:3px 0 12px 0;
    background:url(images/dot_line.gif) repeat-x 0 2px #FFFFFF;}
.left p.dotLine a.readMore{
    background:url(images/read_more_btn.gif) no-repeat 0 0 #FFFFFF; color:#000000;
    font-size:0; line-height:0; text-decoration:none; text-indent:-2000px;
    width:58px; height:13px; display:block; float:right;}
.left p.dotLine a.readMore:hover{
    background:url(images/read_more_btn_h.gif) no-repeat 0 0 #FFFFFF; color:#000000;
    font-size:0; line-height:0; text-decoration:none; text-indent:-2000px;
    width:58px; height:13px; display:block; float:right;}
.event{
    width:480px; padding:26px 0 0 0;}
.eventLeft{
    width:324px; padding:6px 0 0 0; float:left;}
.eventLeft h2{
    font:bold 20px/25px Arial, Helvetica, sans-serif; color:#337BA6;
    background-color:#FFFFFF; width:124px; float:left; padding:0 0 6px 0;}
.eventLeft h2 span{
    font:bold 20px/25px Arial, Helvetica, sans-serif; color:#F50B04; background-color:#FFFFFF;}
.eventLeft span.date{
    background:url(images/date_bg.gif) no-repeat 0 0 #FFFFFF; color:#333333;
    font:bold 11px/15px "Trebuchet MS", Arial, Helvetica, sans-serif; text-align:center;
    width:117px; height:15px; display:block; float:left; margin:6px 0 0 12px;}
.eventLeft p{
    font:normal 12px/18px Arial, Helvetica, sans-serif; color:#363636;
    background:url(images/left_line.gif) no-repeat 0 16px #FFFFFF; padding:10px 0 12px 16px;}
.eventLeft p.dotLine1{
    color:#363636; font-size:0; line-height:0;
    width:304px; height:13px; padding:3px 0 0 0;
    background:url(images/dot_line.gif) repeat-x 0 2px #FFFFFF; }
.eventLeft p.dotLine1 a.viewMore{
    background:url(images/view_more_btn.gif) no-repeat 0 0 #FFFFFF; color:#000000;
    font-size:0; line-height:0; text-decoration:none; text-indent:-2000px;
    width:58px; height:13px; display:block; float:right;}
.eventLeft p.dotLine1 a.viewMore:hover{
    background:url(images/view_more_btn_h.gif) no-repeat 0 0 #FFFFFF; color:#000000;
    font-size:0; line-height:0; text-decoration:none; text-indent:-2000px;
    width:58px; height:13px; display:block; float:right;}
.eventRight{
    width:155px; float:left;}
.eventRight img{
    border:none;}
/* -- contact form start -- */
.left form.contact{
    background:url(images/login_bg.gif) no-repeat 0 0 #FFFFFF; color:#000000;
    width:400px; height:350px; padding:14px 14px 34px 16px;}
.left form.contact h2{
    font:normal 18px/18px Arial, Helvetica, sans-serif; width:auto;
    color:#000000; background-color:#F5F5F5; padding:0 0 0 0;}
.left form.contact label{
    font:bold 11px/22px "Trebuchet MS", Arial, Helvetica, sans-serif;
    color:#337BA6; background-color:#F5F5F5; padding:0 0 8px 0;}
.left form.contact input{
    width:180px; height:15px; padding:2px;
    font:normal 11px/15px Arial, Helvetica, sans-serif;
    background-color:#FFFFFF; color:#000000; margin:0;}
.left form.contact textarea{
    width:180px; height:150px; padding:2px;
    font:normal 11px/15px Arial, Helvetica, sans-serif;
    background-color:#FFFFFF; color:#000000; margin:0;}
.left form.contact input.submitBtn{
    width:52px; height:16px; padding:0; margin:3px 0 0 0; float:left;}
.left form.contact p{
    font:bold 11px/25px "Trebuchet MS", Arial, Helvetica, sans-serif;
    color:#337BA6; background-color:#F5F5F5; padding:4px 0 0 0;}

/* -- contact form end -- */

/* -- left pannel end -- */

/* -- right pannel start -- */
.right{
    width:220px; float:left;}
.right form.search{
    background:url(images/search_bg.gif) no-repeat 0 0 #FFFFFF; color:#000000;
    width:189px; height:63px; padding:14px 14px 30px 16px;}
.right form.search label{
    font:normal 18px/18px Arial, Helvetica, sans-serif;
    color:#000000; float:left;}

.right form.search input{
    width:180px; height:15px; padding:2px;
    font:normal 11px/15px Arial, Helvetica, sans-serif;
    background-color:#FFFFFF; color:#000000; margin:7px 0 5px 0;}
.right form.search input.searchBtn{
    width:52px; height:16px; padding:0; margin:0; float:right;}
.right h2{
    font:bold 20px/25px Arial, Helvetica, sans-serif; color:#337BA6;
    background-color:#FFFFFF; height:25px; width:110px; padding:0 0 0 16px; float:left;}
.right h2 span{
    font:bold 20px/25px  Arial, Helvetica, sans-serif; color:#F50B04;
    background-color:#FFFFFF; height:25px;}
.right span.dot{
    background:url(images/dot_line.gif) repeat-x 0 18px #FFFFFF;
    height:25px; width:90px; display:block; float:left; color:#000000;}
.right ul{    
    padding:7px 0 0 16px;}
.right ul li a{
    font:bold 12px/19px Arial, Helvetica, sans-serif; color:#535353;
    padding:0 0 0 12px; display:block; text-decoration:none;
    background:url(images/red_arrow_bullet.gif) no-repeat 0 6px #FFFFFF;}
.right ul li a:hover{
    font:bold 13px/19px Arial, Helvetica, sans-serif; color:#535353;
    padding:0 0 0 12px; display:block; text-decoration:none;
    background:url(images/red_arrow_bullet.gif) no-repeat 0 6px #BFDEF7;}
/* -- right pannel end -- */
/* footer start -- */
#footer{
    background:url(images/footer_bg.gif) no-repeat center top #0E4472; color:#000000;}
.footer{
    width:490px; height:115px; margin:0 auto; padding:18px 0 0 0;}
.footer ul{
    width:445px; margin:0 auto;}
.footer ul li{
    font:bold 11px/20px "Trebuchet MS", Arial, Helvetica, sans-serif;
    color:#FFFFFF; background-color:#0E4472; float:left;}
.footer ul li a{
    font:bold 11px/20px "Trebuchet MS", Arial, Helvetica, sans-serif; text-decoration:none;
    color:#FFFFFF; background-color:#0E4472; padding:0 8px;}
.footer ul li a:hover{
    font:bold 11px/20px "Trebuchet MS", Arial, Helvetica, sans-serif; text-decoration:none;
    color:#FFFFFF; background-color:#11558C; padding:0 8px;}
.footer p{
    margin:0 auto; width:300px; color:#DBEDFB; background-color:#0E4472;
    font:normal 10px/18px Arial, Helvetica, sans-serif;}
.footer p.valid{
    margin:0 auto; width:300px;}
.footer p.valid a.xhtml{
    background:url(images/xhtml_btn.gif) no-repeat 0 0 #0E4472; color:#FFFFFF; margin:5px 0 8px 0px;
    text-decoration:none; text-indent:-2000px; width:70px; height:23px; display:block; float:left;}
.footer p.valid a.xhtml:hover{
    background:url(images/xhtml_btn_h.gif) no-repeat 0 0 #0E4472; color:#FFFFFF; margin:5px 0 8px 0px;
    text-decoration:none; text-indent:-2000px; width:70px; height:23px; display:block; float:left;}
.footer p.valid a.css{
    background:url(images/css_btn.gif) no-repeat 0 0 #0E4472; color:#FFFFFF; margin:5px 0 8px 4px;
    text-decoration:none; text-indent:-2000px; width:70px; height:23px; display:block; float:left;}
.footer p.valid a.css:hover{
    background:url(images/css_btn_h.gif) no-repeat 0 0 #0E4472; color:#FFFFFF; margin:5px 0 8px 4px;
    text-decoration:none; text-indent:-2000px; width:70px; height:23px; display:block; float:left;}
.footer p.tworld{
    margin:0 auto; width:170px; height:17px; padding:0 3px;
    font:normal 12px/16px Arial, Helvetica, sans-serif; color:#414141;
    background-color:#FFFFFF; text-align:center;}
.footer p.signature a{
    font:bold 12px/16px Arial, Helvetica, sans-serif; color:#FFFFFF;
    text-align:center; text-decoration:none;}
.footer p.signature a:hover{
    font:bold 12px/16px Arial, Helvetica, sans-serif; color:#FFFFFF; background-color:#11558C; text-align:center; text-decoration:none;}
/* footer end -- */
/* Web Industry -- */
Ich hoffe einer weiß warum dort nichts angezeigt wird

Würde mich über eine helfende Antwort freuen

Gruß,
Malak