Bereich schneidet Navigation ab

[sebse]

Hallo,
ich habe folgendes Layout eingebaut:
http://www.tutorials.de/forum/css/252653-css-layout-ich-verzweifel-fast.html
Das geht auch alles bestens mit den Bereichen.

Nur ist nun folgendes Problem.
Wenn im Content-Bereich der Inhalt kürzer ist als die Navigation, dann wird diese abgeschnitten auf der Höhe, auf der der Content aufhört.
Ist der Content länger als die Navigation, dann tritt das Problem nicht auf.

Komischer weise nur im IE6

Hat mir da jemand nen Rat, wie ich das beheben kann?

Danke schon mal im voraus,

Sebastian

 

[versuch13]

Wäre hilfreich wenn du auch deinen Quelltext und dein CSS zeigen könntest. Aber jetzt einfach mal so ins blaue, gib der Navigation eine feste höhen Angabe.

 

[sebse]

Das Problem an der Navigation ist, dass die über das CMS dynamisch generiert wird und somit ne variable Höhe hat.

Hier CSS und Template:

<!-- ###DOCUMENT_BODY### START-->
<div id="container">
<div id="nav">
<div class="nav">
<!-- ###VERTNAV### START-->
<!-- ###VERTNAV### END-->
</div>
</div>
<div id="content-head">
</div>
<div id="main-content">
<div class="content">
<!-- ###CONTENT### START-->
<!-- ###CONTENT### END-->
<br><br><br><br><br>

</div>
</div>

<script type="text/javascript" src="http://tracking.stangermedia.net/track.70.js"></script>
</div>

<!-- ###DOCUMENT_BODY### END-->

body{
	background:url(bg.jpg) 0 0 ; position:relative;
	background-repeat: no-repeat;
	background-color: White;
}
#container {
}
	#nav{
       float: left;


}
#content-head{
        height: 215px;
        margin-left: 275px;
}
#main-content {

}

.nav{
	margin-left: 10px;
	width:250px;
	margin-top: 50px;

	
}
.nav-act a{
	width:250px;
	margin-left: 10px;
	display:block;
	background-image: url(button.gif);
	font-size: 20px;
	font-style: normal;
	font-weight: bold;
	color: #0E606B;
	background-repeat: no-repeat;
	font: normal normal Arial, Helvetica, sans-serif;
	padding-left: 14px;
	height: 57px;
	padding-top: 15px;
	text-decoration: none;
	
}
.nav-act-sub a{
	width:250px;
	margin-left: 10px;
	display:block;
	background-image: url(button-sub.gif);
	font-size: 20px;
	font-style: normal;
	font-weight: bold;
	color: #0E606B;
	background-repeat: no-repeat;
	font: normal normal Arial, Helvetica, sans-serif;
	padding-left: 15px;
	height: 54px;
	padding-top: 13px;
	text-decoration: none;
	}
.content {
        /*float: left;*/ /* auskommentiert = deaktiviert */
        position:relative;
        margin-left: 295px; 
        color: #303030;
        font-size: 15px;
        font-style: normal;
        font-variant: normal;
        font-weight: normal;
        font-family: Arial, Helvetica, sans-serif;
        text-align: left;
        width: 520px;

}

Link: http://www.vision-security.de/

 

[Maik]

Ich habe mal Deine Code-Angaben in ein Dokument eingefügt und im IE getestet. Bei mir wird die Navigation nicht abgeschnitten, wenn sich im Content-DIV weniger Inhalt befindet, als in der Navigation (meine Testumgebung: Win2k, IE 6.0).

In der Navigation habe ich fünf Links und im Content-DIV zwei Textabsätze notiert, das Ergebnis kannst Du im Anhang betrachten.

Spoiler

.

 

[Maik]

Wenn ich die (überflüssigen) DIVs mit der Klasse .nav-act aus dem Quellcode nehme, und die Klasse direkt auf die Links anwende, werden sie bei mir nicht abgeschnitten.

a.nav-act{
	width:250px;
	margin-left: 10px;
	display:block;
	background-image: url(button.gif);
	font-size: 20px;
	font-style: normal;
	font-weight: bold;
	color: #0E606B;
	background-repeat: no-repeat;
	font: normal normal Arial, Helvetica, sans-serif;
	padding-left: 14px;
	height: 57px;
	padding-top: 15px;
	text-decoration: none;
}

<div id="nav">
  <div class="nav">
    <a href="start.html" class="nav-act">Start</a>
    <a href="anwendungen.html" class="nav-act">Anwendungen</a>
    <a href="technik.html" class="nav-act">Technik</a>
    <a href="vermietung.html" class="nav-act">Vermietung</a>
    <a href="kontakt.html" class="nav-act">Kontakt</a>
    <a href="mitglieder.html" class="nav-act">Mitglieder</a>
    <a href="impressum.html" class="nav-act">Impressum</a>
  </div>
</div>