Container scrollt nicht über ganzen Bildschirm

[MaxPlanck]

Hallo Liebe Community,

Ich habe eine Homepage erstellt. Muss auch gleich dazu sagen, dass es mein erster gehversuch mit CSS ist.

Die HP is nun fertig. Jetzt hab ich allerdings ein Problem bei dem ich hoffe ihr könnt mir helfen...

Die HP ist auf www.dsandig/alpan/index.html erreichbar.

nun zum Problem:

Wenn die Bildschirmauflösung (höhe) geringer als die Maincontainer höhe ausfällt, so wird ein Scrollbalken erstellt. Das ist absolut ok und sollte ja auch so sein.
Leider wird aber nicht über den ganzen Container gescrollt sondern nur über einen teil. So fehlt oben ein teil der Darstellung.

kennt jemand das Problem??

Vielen Dank für eure Mühe,

Dennis

[MaxPlanck]

entschuldigung für den fehlerhaften link!!

Alpan

[timonator]

Ich bin mal so frei, und reichen den css-code nach.
Zum kommentieren bin ich jezt aber zu müde. ;)

  
body, html {  
	margin:0;  
	padding:0;  
	width:100%;  
	height:100%;  
	font-family:Arial, Helvetica, sans-serif;  
	background-color:#F2EBD2;  
}  
  
.maincontainer {  
	background-color:#EFDFC5;  
	height: 650px;  
	width: 1100px;  
	margin-top: -325px;  
	margin-left: -550px;  
	position: absolute;  
	left: 50%;  
	top: 50%;  
	border: 1px solid;  
	border-color:#C5BA9D;  
}  
  
#head {  
	height: 150px;  
	width: 1100px;  
	text-align:left;  
	vertical-align:middle;  
	background-image:url(Logo/Banner.png);  
	border-bottom:1px solid;  
	border-color:#C5BA9D;  
}  
  
#navicontainer {  
	text-align: left;  
	height:35px;  
	text-align:left;  
	font:Arial, Helvetica, sans-serif;  
	font-size:20px;  
	margin:10px 0px 0px 2px;  
	font-weight:bold;  
	background-color:#EFDFC5;  
}  
  
#main {  
	background-color: #fff;  
	height: 454px;  
	width: 1100px;  
}  

n8 all

[Gunther]

Hallo Dennis!

Die HP is nun fertig. Jetzt hab ich allerdings ein Problem bei dem ich hoffe ihr könnt mir helfen...

Also doch noch nicht "fertig". ;-)

nun zum Problem:

Wenn die Bildschirmauflösung (höhe) geringer als die Maincontainer höhe ausfällt, so wird ein Scrollbalken erstellt. Das ist absolut ok und sollte ja auch so sein.
Leider wird aber nicht über den ganzen Container gescrollt sondern nur über einen teil. So fehlt oben ein teil der Darstellung.

kennt jemand das Problem??

Ja. Du machst (u.a.) den Fehler, den (leider) viele ("unerfahrene") User machen.
Erstens verwechselst du die Viewportgröße mit der Bildschirmauflösung. Beides sind zwei völlig unterschiedliche Dinge. Die Forums-Suche hilft hier weiter.
Und zweitens produzierst du "dein Problem" selber, durch eine "ungeeignete" Positionierung deines maincontainers. Lass' mal alle Formatierungen weg bis auf

  
#maincontainer {  
  width: 960px;  
  margin: 0 auto;  
}  

Und für Inhaltscontainer, die i.d.R. ja nur genau einmal auf einer Site existieren/ vorkommen, sollte man imho besser eine ID, als eine Klasse verwenden.

Last but not least solltest du auf die Verwendung von Frames verzichten. Auch dieses Thema ist hier bereits so oft und ausführlich diskutiert worden, dass hier ebenfalls die Forums-Suche erschöpfend Auskunft gibt.

Noch eine allgemeine Anmerkung:
Über 50% aller Probleme mit der Positionierung von Elementen per CSS rühren aus der meist unnötigen Verwendung von position:absolute her, weil diese vermeintlich immer als das "einfachste Mittel der Wahl" erscheint, was sie aber in den seltensten Fällen ist. Und weil auch ihre Funktionsweise nicht (hinreichend) verstanden wird (siehe bspw. Google: css+elementfluss+position+absolute).

Ich empfehle von daher: <http://de.selfhtml.org/css/eigenschaften/positionierung.htm#position@title=position (Positionsart)>

Gruß Gunther