test - partyhuette

So siehts im Moment aus (ein- / ausblenden)

Der Code für Text über dem Design:

Das fettgedruckte sind die Verlinkungen bzw. Beschriftungen für die Navi-Buttons.
Das rote musst du wiederholen, um für den jeweiligen Navi-Punkt weitere (Unter-)Unterpunkte einzufügen.
Das blaue ist der Inhalt der beiden Boxen, die nur auf der Home-Seite zu sehen sein sollen.

Der Code für Text unter dem Design:

        </div>
        <div id="my_footer">
            <div style="text-align: left;">Copyright by Chris H.</div>
            <div style="text-align: right;">Design by <a href="http://dreifragezeichen.bplaced.net" target="_blank">dreifragezeichen.de.to</a></div>
        </div>
    </div>
    <div id="my_right">
        <div id="my_last_event">
            Inhalt...und Inhalt...mehr Inhalt...noch mehr Inhalt, alles nur Inhalt...
        </div>
        <div id="my_right_box_1" class="my_right_box">
            <div class="my_right_heading">Uhr</div>
            <div class="my_right_content">
                <script src="http://www.clocklink.com/embed.js"></script><script type="text/javascript" language="JavaScript">obj=new Object;obj.clockfile="5005-orange.swf";obj.TimeZone="Germany_Berlin";obj.width=120;obj.height=40;obj.wmode="transparent";showClock(obj);</script>
            </div>
        </div>
        <div id="my_right_box2" class="my_right_box">
            <div class="my_right_heading">Musik</div>
            <div class="my_right_content">
                <a href="javascript:void(window.open('http://www.partyhuette-vreden.de.tl/Player.htm', '', 'resizable=no, location=no, menubar=no, scrollbars=no, status=no, toolbar=no, fullscreen=no, dependent=no, width=360, height=150'))"><img src="https://img.webme.com/pic/p/partyhuette-vreden/radiobutton.png" border="0"></a>
            </div>
        </div>
        <div id="my_right_box_3" class="my_right_box">
            <div class="my_right_heading">Login</div>
            <div class="my_right_content">
                <form action="%3Cb%3E%3Cfont-color%3D-g-%23FF4500-g--%3EMitgliederLogin.htm" method="POST">
                    <table>
                        <tr>
                            <td>Benutzername:</td>
                            <td><input style="width: 65px" type="text" name="modulenter[name]" value=""></td>
                        </tr>
                        <tr>
                            <td>Kennwort:</td>
                            <td><input style="width: 65px" type="PASSWORD" name="modulenter[kennwort]" value=""></td>
                        </tr>
                    </table>
                    <input type="hidden" name="mode" value="1">
                    <input type="hidden" name="checklogin" value="1">
                    <input type="submit" value="LogIn">
                </form>
            </div>
        </div>
        <div id="my_right_box_4" class="my_right_box">
            <div class="my_right_heading">Letzte Änderung</div>
            <div class="my_right_content">
                31. 05. 2010<br/>
                <a href="/Home.htm">*Link*</a>
            </div>
        </div>
    </div>

</div>
</td></tr></table>

Das grüne ist der Text für die hellblaue Box.
Das orangefarbene sind die Überschriften und Inhalten der restlichen Boxen.
Das rote mit gelbem Hintergrund ist der Inhalt des Footers, zuerst das linksbündige, dann das rechtsbündige.
In der Login-Box ist das erste kursive die Adresse zur Login-Seite und das zweite kursive der Text des Buttons.

Der CSS-Code:

* {
margin: 0;
padding: 0;
}

#nav_container, #sidebar_container, #header, #title {
display: none;
}

body {
background-color: #000000;
z-index: -3;
}

#all_container {
width: 790px;
position: absolute;
left: 50%;
margin-left: -395px;
background-color: #000;
text-align: center;
}

#my_header {
width: 790px;
height: 119px;
margin-bottom: 50px;
background-image:url(https://img.webme.com/pic/d/dietestseitevonmir/party_header.png);
background-position: center;
background-repeat: no-repeat;
}

#my_nav {
width: 700px;
height: 30px;
background-image:url(https://img.webme.com/pic/t/testseite-partyhuette/party_navb.png);
background-position: center;
background-repeat: no-repeat;
margin: 10px 45px;
padding-top: 8px;
text-align: center;
position: absolute;
z-index: 0;
top: 113px;
}

#my_nav li {
list-style-type: none;
float: left;
width: 16.6%;
background-image:url(https://img.webme.com/pic/d/dietestseitevonmir/party_nav_line.png);
background-position: left center;
background-repeat: no-repeat;
position: relative;
padding: 0;
z-index: 1;
}

#my_nav li li{
width: 100%;
}

#my_nav li:first-child {
background-image: none;
}

#my_nav li a{
color: #fff;
font-size: 11px;
text-decoration: none;
}

#my_nav li a:hover {
text-decoration: underline;
}

#my_nav li.mainnav {
background-image: none;
}

#my_nav li.mainnav li:first-child {
background-image:url(https://img.webme.com/pic/d/dietestseitevonmir/party_nav_line.png);
}

li.subnav {
background-color: #1b1d1e;
background-image: none!important;
}

li.sub_subnav {
background-color: #35383b;
}

#my_welcome {
display: none;
}

#my_left {
display: inline-block;
width: 520px;
vertical-align: top;
}

#my_home_content {
display: none;
}

#my_latest_news {
background-image:url(https://img.webme.com/pic/d/dietestseitevonmir/party_latest_news.png);
background-position: right center;
background-repeat: no-repeat;
padding-top: 42px;
height: 156px;
padding-left: 50px;
width: 151px;
margin-right: 110px;
display: inline-block;
background-repeat: no-repeat;
text-align: left;
color: #fff;
line-height: 26px;
}

#my_latest_news a {
color: #fff;
text-decoration: none;
}

#my_latest_news a:hover {
text-decoration: underline;
}

#my_home_box {
background-image:url(https://img.webme.com/pic/d/dietestseitevonmir/party_home_box.png);
padding-top: 42px;
height: 156px;
padding-left: 10px;
width: 194px;
display: inline-block;
background-repeat: no-repeat;
text-align: left;
color: #fff;
line-height: 26px;
}

#my_content {
background-color: #fff;
background-position: top right;
background-repeat: no-repeat;
display: inline-block;
border-radius: 10px;
-moz-border-radius: 10px;
-khtml-border-radius: 10px;
width: 500px;
padding: 10px;
text-align: left;
}

#my_right {
width: 167px;
display: inline-block;
vertical-align: top;
margin-left: 10px;
}

#my_last_event {
width: 135px;
height: 153px;
background-image:url(https://img.webme.com/pic/d/dietestseitevonmir/party_last_event.png);
background-repeat: no-repeat;
margin-bottom: 10px;
text-align: left;
color: #fff;
line-height: 18px;
font-size: 11px;
padding: 36px 15px 5px;
}

.my_right_heading {
background-image:url(https://img.webme.com/pic/d/dietestseitevonmir/party_right_heading.png);
height: 30px;
padding-top: 6px;
width: 167px;
text-align: center;
color: #fff;
}

.my_right_content {
width: 147px;
padding: 5px 10px 10px;
text-align: left;
color: #fff;
}

#my_footer {
background-image: url(https://img.webme.com/pic/d/dietestseitevonmir/party_footer.png);
height: 36px;
width: 100%;
margin-top: 10px;
border-radius: 10px;
-moz-border-radius: 10px;
-khtml-border-radius: 10px;
}

#my_footer div {
width: 45%;
padding: 0 2%;
color: #fff;
display: inline-block;
margin-top: 7px;
}

#my_footer a, .my_right_content a {
color: #fff;
text-decoration: none;
}

#my_footer a:hover, .my_right_content a:hover {
text-decoration: underline;
}

-->
</style>
<table width="100%" align="center" cellpadding="0" cellspacing="0" border="0"><tr><td align="center" width="100%">
<style type="text/css">
<!--

Das hier musst du noch auf der Home-Seite im Seitenquelltext einfügen:

Wie füge ich einen neuen Hauptpunkt in der Navi ein?
Einfach im Navi-Code an der Stelle, an der der Punkt stehen soll <li><a href="/Besipiel.htm">Beispiel</a></li> einfügen. Zusätzlich muss im CSS-Code der width-Wert für #my_nav_li auf (100/Anz. Hauptpunkte)% anpassen.

Wie füge ich einen Unterpunkt für einen Hauptpunkt ein?
Für den ersten Unterpunkt musst du das <li><a href="/Besipiel.htm">Beispiel</a></li> durch das hier ersetzen:
<li class="mainnav">
    <ul onmouseover="javascript: showsubnav('example');" onmouseout="javascript: showsubnav('example');">
       <li><a href="/Beispiel.htm">Beispiel</a></li>
       <li style="display: none;" id="subnav_container_example" class="subnav_container">
          <ul>
            <li class="subnav subnav_example"><a href="/Beispiel1.htm">Punkt 4.1</a></li>
          </ul>
        </li>
    </ul>
</li>

Für einen weiteren Unterpunkt das gelb hinterlegte einfach wiederholen.