centered divs centered blijven aanpassen van viewport

[johan2009]

Ok.. ik heb het volgende probleem (zie afbeelding)

1. heb een div als header van 1200px breed daarin zit child-div van 960px breed. Parent-div heeft background image van 1200px breed. Nu wil ik dat de alles centered blijft in de browser. Wanneer ik viewport aanpas naar kleiner dan 1200px dan blijft de 1200px-div links tegen viewport staan. ik wil dat alles centered blijft en pas bij vieport < 960px scrollbalk vertoond.
2. verder heb ik afbeeldingen absoluut gepositioneerd in divs. De afbeeldingen vallen buiten of op 960px breedte. Deze afbeeldingen mogen tevens geen scrollbar veroorzaken. edit: afbeeldingen zijn backgrounds in css.

Ik weet niet of ik te volgen ben?! ik weet het namelijk niet anders uit te leggen. Kortom; viewport < 960px => verticale scrollbalk + divs gecentreerd. Hoe doe ik dat?

[OkkE]

Logisch, wanneer de inhoud (je DIVs) 960+ zijn, zal er altijd een scrollbar ontstaan. Enige oplossing is alles met achtergrond-images doen, waarbij de images gecentreerd zijn en je DIVs width: 100% zijn (behalve uiteraard je content).

Zit je alleen nog met de images die je nu absolute hebt gezet, hoe dat op te lossen is, hangt af van je ontwerp.

[johan2009]

@OkkE

@#$%$% dat het zo makkelijk is. Ik was hier niet opgekomen --> div width 100% en background-positioning: 50% 0. Thanx!

Zit ik nog met de absoluten afbeeldingen. Check maar op http://www.myradon.net alleen top is nu relevant rest is nog zooitje wegens Re-design.

edit: ik heb in Firefox een horizontale scrollbalk bij elke breedte van viewport, Na refresh weer niet!

[ Voor 16% gewijzigd door johan2009 op 22-12-2010 12:09 ]

[Bosmonster]

background-position: center is iets anders dan 50%

[johan2009]

Ik wil niet bijdehand zijn maar dat is wel het zelfde left top = 0 0, center center = 50% 50%, right bottom = 100% 100%. Waarbij op 50% 50% ook het middelpunt van de afbeelding als registration point (ff op z'n flash's) wordt genomen. Ik heb boek "CSS the missing manual" aangeschaft. ik vind het een aanrader. sommige dingen staan er niet zodoende deze vragen hier

[ Voor 9% gewijzigd door johan2009 op 22-12-2010 22:47 ]

[johan2009]

ik heb het al gevonden mbt. images buiten div positioneren en geen horizontale scrollbalk bij verkleinen viewport; negatieve margins gebruiken is hier in de uitkomst.