Feststehender Header verschwindet im IE9 nach anspringen des Ankers

caria

Grünschnabel
Hallo zusammen,

habe gerade Seite mit festestehendem Header erstellt. Die Navigationspunkte sind im Header platziert und sollen einzelne Abschnitte der langen scrollbaren Seite anspringen, dort habe ich Sprungmarken gesetzt. Das funktioniert im FF auch einwandfrei. Beim IE aber ist der Header nicht mehr zu sehen. So lange ich nur scrolle ist alles ok, der Text verschwindet oben unter dem Header. Benutze ich aber einen Link, ist der Header "weg".

Was habe ich übersehen?
Oder welche "Sonderbehandlung" braucht der IE nun wieder? :(

Hab das verkürzte Script mal kopiert.

Freu mich auf Eure Hilfe ;)
HTML:
	<div id="HBox">	
		<div id="Header">
			<div id="Nav"> </div>
		</div>	
	</div>
	
	<div id="CBox">											
	  <div id="Content"> 
	  
	  	<div class="Abschnitt">Abschnitt 1 </div>
		
		<div class="Abschnitt">Abschnitt 2 </div>
		
		<div class="Abschnitt">Abschnitt 3 </div>
	  
	  </div>
	</div>
CSS:
* html, * html body {
    overflow:hidden;
    bottom:0;
    height:100%;
}
html, body { 
	font-family: Verdana, Arial, Tahoma, Sans-serif;
    text-align:center;
	font-size: 100%;
    min-height:100%;
    width:100%;
	margin:0;
    padding:0;   
	background-color: #fff;
	}
	
* html #HBox,  {
    position:absolute;
    width:100%;
	}
	
	#Header {height:100%;
		    position:static;}

#HBox {
			text-align: center;
			top:0; left:0; right:0;		
			padding: 0;
			height: 205px;
			width: 100%;				
			background: url("pics/ly_bg_pbody_2px.jpg") repeat-x;
			background-color: transparent;
			position: fixed!important;
			z-index: 150;}
			
	 #Header {
		 	text-align: left;
			margin: 0 auto 0 auto;
			height: 205px;
			width: 1008px;
			background: url("pics/ly_head_pic.png") center top no-repeat; 
			background-color: transparent;
			position: static;} 
						
			
* html #CBox {
    position:absolute;
    top:205px; bottom:0; left:0; right:0;
    height:100%; 
    width:100%;   
   	overflow:auto; 
	z-index: 10;
}

#CBox {
		text-align: center;
		font-size: 90%;
		margin: 0;	
		padding: 0;
		width: 100%;	
		background: url("pics/ly_bg_pb.gif") center top no-repeat;
		position: relative;
		float:left;
		z-index: 20;}
		
		#Content {
			text-align: left;
			margin: 150px auto 0px auto;		
			padding: 20px;
			width: 1004px;
			background-color: transparent;
			z-index: 20;}
			
			.Abschnitt {	
				color: #000; 
				font-size: 95%;
				margin: 0px 10px 10px 0;
				padding: 0px 0 0px 0;
				min-height: 350px;
				width: 100%;				
				float: left;
				position: relative;
				}
 
Zuletzt bearbeitet von einem Moderator:
Hab es selbst herausgefunden,
der erste Anker musste in eine andere div-box geschachtelt werden, also weiter nach oben :)
 

Neue Beiträge

Zurück