Tweet
So Leute,
eine kleine CSS-Nuß zu knacken an Weihnachten
Ich schließe gerade ein seit einem Jahr laufendes Riesenprojekt ab, das eine Deadline in wenigen Tagen hat und noch einige Bauchweh-Punkte, um die ich mich kümmern muß. Eines davon ist folgendes:
Ist es möglich oder hat jemand eine Idee, im Body eines Dokuments platzierte Hintergrundbilder mit background-position: left top in die Mitte zu bekommen, aber mit einer in Pixeln festgelegten horizontalen Verschiebung nach links oder rechts relativ zur Bildmitte? Unbedingt mit purem CSS.
Die Situation ist die, daß mir bei der Erstellung eines CMS ein gravierender Fehler unterlaufen ist. Monatelang wurden von der Kundin in langer Arbeit Seiten gestaltet, die alle ein großes Hintergrundmotiv haben, die für den Gesamteindruck äußerst wichtig sind und die millimetergenau im Verhältnis zu den Inhalten sitzen müssen. Die Inhalte sitzen zumeist mittig.
Ich hab sie aber nicht darauf hingewiesen, daß die Hintergrundbilder dann ebenfalls mittig seitzen müssen, damit sie sich später bei anderen Auflösungen (Arbeitsauflösung war 1280x768) nicht verschieben. D.h. es gibt jetzt viele Inhalte, die mittige Inhalte, aber linksbündige Hintergrundbilder haben (Standardeinstellung), die nur bei 1280 Pixeln richtig zueinander stehen und sonst falsch.
Das muß ich jetzt richten, und habe noch keine Idee wie. Ich muß also diese Seiten so hinkriegen, daß die Hintergrundbilder zuverlässig mittig sind, aber eben so positioniert sind, daß sie bei einer horizontalen Auflösung von 1280 Pixeln links abschließen würde, was die gestalterische Grundlage war. Die Inhalte liegen in DIVs über dem Bild und müssen mittig bleiben.
Perfekt wäre die CSS-Eigenschaft background-position: center mit der Möglichkeit, quasi "-50px" zusätzlich anzugeben. Das gibbet m.W. aber nicht.
Ist das Problem nachvollziehbar? Ich mache gern auch eine Skizze. Hat jemand Ideen, ohne Javascript und allzu komplexe Konstrukte?
Danke!
eine kleine CSS-Nuß zu knacken an Weihnachten
Ich schließe gerade ein seit einem Jahr laufendes Riesenprojekt ab, das eine Deadline in wenigen Tagen hat und noch einige Bauchweh-Punkte, um die ich mich kümmern muß. Eines davon ist folgendes:
Ist es möglich oder hat jemand eine Idee, im Body eines Dokuments platzierte Hintergrundbilder mit background-position: left top in die Mitte zu bekommen, aber mit einer in Pixeln festgelegten horizontalen Verschiebung nach links oder rechts relativ zur Bildmitte? Unbedingt mit purem CSS.
Die Situation ist die, daß mir bei der Erstellung eines CMS ein gravierender Fehler unterlaufen ist. Monatelang wurden von der Kundin in langer Arbeit Seiten gestaltet, die alle ein großes Hintergrundmotiv haben, die für den Gesamteindruck äußerst wichtig sind und die millimetergenau im Verhältnis zu den Inhalten sitzen müssen. Die Inhalte sitzen zumeist mittig.
Ich hab sie aber nicht darauf hingewiesen, daß die Hintergrundbilder dann ebenfalls mittig seitzen müssen, damit sie sich später bei anderen Auflösungen (Arbeitsauflösung war 1280x768) nicht verschieben. D.h. es gibt jetzt viele Inhalte, die mittige Inhalte, aber linksbündige Hintergrundbilder haben (Standardeinstellung), die nur bei 1280 Pixeln richtig zueinander stehen und sonst falsch.
Das muß ich jetzt richten, und habe noch keine Idee wie. Ich muß also diese Seiten so hinkriegen, daß die Hintergrundbilder zuverlässig mittig sind, aber eben so positioniert sind, daß sie bei einer horizontalen Auflösung von 1280 Pixeln links abschließen würde, was die gestalterische Grundlage war. Die Inhalte liegen in DIVs über dem Bild und müssen mittig bleiben.
Perfekt wäre die CSS-Eigenschaft background-position: center mit der Möglichkeit, quasi "-50px" zusätzlich anzugeben. Das gibbet m.W. aber nicht.
Ist das Problem nachvollziehbar? Ich mache gern auch eine Skizze. Hat jemand Ideen, ohne Javascript und allzu komplexe Konstrukte?
Danke!
Kommentar