✔ Zentrierungs Problem

[reddragon90]

Guten Tag,

wieso ist bei folgendem Code das Problem, dass ich zwar den Div zentriert sehe, dieser aber sobald ich zum Beispiel meine Favoriten in meinem Browser öffne, und diesen in die Breite verlängere, plötzlich ein horizontaler Scrollbalken zu sehen?

#container {
	height: 700px;
	width: 1000px;
	margin: 0px auto;
	text-align: center;
}

 

[Maik]

Hi,

wenn der horizontale Anzeigebereich des Browserfensters die definierte Breite der Box unterschreitet, wird diese nicht mehr mittels margin:0 auto zentriert, sondern linksbündig ausgerichtet und der horizontale Scrollbalken eingeblendet, damit der rechte Bereich der Box erreichbar ist.

Das gleiche Verhalten tritt auch dann auf, wenn du keine zusätzlichen Leisten einblendest, sondern lediglich die Größe des Fensters soweit runterskalierst, dass der Viewport schmäler als die Box ist.

 

[reddragon90]

Und wie kann ich dieses Problem beheben? Kann ich es überhaupt beheben?

 

[Maik]

Wenn du deine Seitenbesucher verärgern möchtest:

#container {
	height: 700px;
	width: 1000px;
	position:absolute;
        left:50%;
        margin-left:-500px;
	text-align: center;
}

Auf diese Weise wird die Box weiterhin horizontal zentriert, aber der linke und rechte "Überschuss" bei einem zu kleinen Viewport ist dann nicht mehr zugänglich.

 

[reddragon90]

Nee, meine Besucher möchte lieber nicht verärgern! Dann such ich mir eine andere Möglichkeit wie ich mein Layout gestalten kann, ohne Besucher weg zu bekommen