XHTMLforum

XHTMLforum (http://xhtmlforum.de/index.php)
-   CSS (http://xhtmlforum.de/forumdisplay.php?f=73)
-   -   zentrierte Seite und Scrollen nach links - geht das überhaupt? (http://xhtmlforum.de/showthread.php?t=61572)

Lucretia 28.06.2010 12:08

zentrierte Seite und Scrollen nach links - geht das überhaupt?
 
Hallo Experten,

ich habe hier ein Layout, das aus designtechnischen Gründen an der unteren Mitte ausgerichtet sein soll.
Dummy: Testseite
(ist eigentlich eine Joomla-Seite, daher noch einiges an CSS-Restballast...)
CSS dazu: http://www.webdesign-hamburg.org/testseite/template.css

Hintergrundbild und den Content habe ich jedenfalls per negativem Margin zentriert:
div#wrapper {
margin-left: auto;
margin-right: auto;
position : absolute;
min-height : 100%;
left: 50%;
width: 1144px;
margin-left: -572px;
background: url(../images/bg_startseite.jpg) bottom no-repeat;
}


Nun beschwert sich der Kunde (zu Recht), dass man nicht mehr nach links scrollen kann, wenn man das Browserfenster klein zieht.
Das ist dumm, denn das Menü rutscht so aus dem Bild und das darf ja nicht sein.
Ich würde sagen, das liegt am negativen margin, oder?

Ich habe dann hier in den FAQ geschaut und das Ganze analog zur Beispielseite CSS vertical center using float and clear nochmal neu aufgebaut - da habe ich zwar keinen negativen Margin drin, lande aber im Endeffekt auch wieder dort, wo ich schonmal war:
Nämlich bei einer Seite, die sich an einem Fixpunkt links oben orientiert und nicht mittig unten. Und genau das soll ja nicht sein, damit das Hintergrundbild immer schön sichtbar bleibt.
Ehrlich gesagt bin ich nach x Versionen dieses Layouts langsam am Ende meines Lateins :(

Gibt es irgendeine Möglichkeit, die Seite mit anderen Mitteln zu zentrieren, so dass man bei kleiner Monitorauflösung in alle Richtungen (sprich: links und rechts) scrollen kann?
Geht das überhaupt??

Der Header soll wie gehabt einen fixen Abstand von oben haben, der Footer von unten, und das Hintergrundbild soll bei einer gewissen Höhe stoppen, so dass es nicht in den oberen Text rutscht. Ab hier gibt es dann vertikale Scrollbalken, wenn man das Browserfenster verkleinert. So weit, so gut (=d.h., so hat es die Designerin vorgesehen, und das funktioniert auch alles wie gewünscht).
Nur, das Ganze muss dann auch noch nach links scrollbar sein. Und ich habe langsam den Verdacht, dass das nicht geht.

öhm... kann man mir folgen?
Wäre wirklich sehr dankbar für Input, und wenn er auch lautet "das geht nicht und ist unlogisch" ;)

ach ja, für IE 5 und 6 wird das Ding NICHT optimiert!

fricca 28.06.2010 12:44

Schau dir FooterStickAlt an (FAQ 7); den gewünschten Platz für das Hintergrundbild kann ein Padding freihalten.

Lucretia 28.06.2010 13:35

Danke!
Der Footer? Der war nun eigentlich nicht das Problem, oder doch? Bisher verhält er sich jedenfalls so, wie er soll.
Mir geht es ja ums horizontale Scrollen, nicht ums vertikale.
Oder bewirkt hier ein padding links und rechts, dass die Seite sich so verhält wie gehabt, aber man zudem auch bis zur linken Kante des Footers/oberen Menüs scrollen kann?

fricca 28.06.2010 13:44

Du brauchst keine abs. Pos. -- und damit hast du auch kein Zentrier-Problem mehr.
Zentriert wird mit dem Wert auto für rechten und linken Margin.

Muamicus 28.06.2010 13:48

Das es nicht nach links zu scrollen geht bewirkt der absolute content.
Du müsstest den content über margin:0 auto; zentrieren.....

Den Head über footerstick unten halten. Hier gibts nen lustigen Thread darüber^^

Zur Seite, hmm alo erst mal der mensch liest von links nach rechts und von oben nach unten. Von daher sollte ein Logo im Web immer links oben sein. (Bei Geschäftspapieren ist es was anderes, da das Logo dort immer rechts oben sein sollte)

Desweiteren sind deine einzelnen container viel zu weit auseinander....der "zusammenhang" fehlt Gesetz der Nähe ;)

Lucretia 28.06.2010 14:01

Zitat:

Zitat von nils_1309 (Beitrag 469099)
Zur Seite, hmm alo erst mal der mensch liest von links nach rechts und von oben nach unten. Von daher sollte ein Logo im Web immer links oben sein. (Bei Geschäftspapieren ist es was anderes, da das Logo dort immer rechts oben sein sollte)

Desweiteren sind deine einzelnen container viel zu weit auseinander....der "zusammenhang" fehlt Gesetz der Nähe ;)

ja, ich weiß. Das Ganze war nicht meine Idee, die Designerin wünscht das so. ICH habe schon mehrfach versucht, ihr und dem Kunden zu erklären, dass ein Zusammenschieben von Mitte unten ziemlich unlogisch ist, weil dann alle wichtigen Teile aus dem Bild scrollen. Es soll aber leider definitiv tatsächlich so sein :(
Beim Beispiel handelt es sich auch nur um die Startseite, bei den folgeseiten ist da noch content dazwischen.

danke euch, ich probier das jedenalls nochmal aus mit dem Zentrieren per Margin.
Ich dachte nur, da die Page aus dem Beispiel aus den FAQ ( CSS vertical center using float and clear ) auch beim Kleinerziehen an der linken oberen Ecke der Content-Box "stoppt" wäre das nicht meine Lösung...

fricca 28.06.2010 14:03

Zitat:

Zitat von Lucretia (Beitrag 469101)
Ich dachte nur, da die Page aus dem Beispiel aus den FAQ ( CSS vertical center using float and clear ) auch beim Kleinerziehen an der linken oberen Ecke der Content-Box "stoppt" wäre das nicht meine Lösung...

Dieses Beispiel zeigt, wie man einen Bereich fester Größe horizontal und vertikal zentrieren kann. Das hat nichts mit dem zu tun, was du willst -- außer, dass die horizontale Zentrierung eben mit dem genannten Margin erfolgt.

Was du willst, ist 100% Mindesthöhe mit Footer am Ende --> FooterStickAlt.

Muamicus 28.06.2010 14:31

Auf der Startseite nach links und rechts scrollen um Inhalte zu "entdecken"?
Die vorher gar nicht zu sehen sind?!?

ALso ich bin kein Hellseher aber "efolg" wird die seite damit nicht haben.

Lucretia 28.06.2010 20:43

naja, vorher nicht zu sehen sind die ja nur bei recht kleinen Monitoren.
Es ist hier schon davon auszugehen, dass die Zielgruppe eher große Monitore hat - es sei denn, man ist mal mit dem Netbook o.ä. unterwegs.

Lucretia 28.06.2010 21:30

Leute, ich bin zu blöd dazu.
Jetzt hab ich das mehr oder weniger gemäß der Anleitung zentriert:
Testseite
CSS: http://www.webdesign-hamburg.org/tes...late_stick.css

Tja, und was ich bekomme ist wieder das, was ich schon vor 2 Wochen hatte: Nämlich eine Page, bei der die Inhalte nicht nach links aus dem Bild rutschen, sondern beim Kleiner-ziehen des Browserfensters an der linken Textkante stehenbleiben.

Wo muss ich jetzt was verändern, damit der ganze Kram nach links aus dem Bild wandert und trotzdem noch zugänglich ist?
Was meintet ihr, welche Ebene ich per margin:0 auto; zentrieren soll? Und auf welcher Ebene soll das Hintergrundbild liegen?

Oder steht hinter dem Konzept doch ein Denkfehler und es ist nicht so machbar wie die Auftraggeber es sich vorstellen?


Alle Zeitangaben in WEZ +2. Es ist jetzt 19:30 Uhr.

Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2024, vBulletin Solutions, Inc.

© Dirk H. 2003 - 2023