[HTML/CSS] Groot vak met omringende vakken

[mcdronkz]

Ik ben bezig met een website waarbij het de bedoeling is om één groot vak te hebben waarin content komt, en dan allemaal omringende vakken te hebben die de navigatie moeten voorstellen.

Nou leek me dit niet zo'n probleem, en had ik het voor Firefox vrij snel gemaakt. Maar toen ik in IE keek zag het er niet meer uit.

Dit is de site waar het om gaat.

Het is uiteindelijk de bedoeling dat het geheel in het midden komt te staan.

Ik heb geen flauw idee waarom het bij IE fout gaat. Pak ik het op de verkeerde manier aan ?

[Rowanov]

De negatieve top-margin van je #centraal div trekt de zooi scheef in IE. Een oplossing is misschien om die bovenste en onderste rij in een extra div te zetten en die te clearen, of om de blokken links en rechts van je #centraal div in een omvattende container te stoppen. In ieder geval moet die negatieve margin weg

Heb het even geprobeerd; bovenste rij in een omvattend element (div), autolening en motorlening in een blok en hetzelfde voor caravanlening en wozkrediet. Vervolgens de onderste rij ook in een omvattend element en de volgende elementen floaten:

• De bovenste en onderste rij en de blokken daarin
• De omvattende blokken links en rechts van het centrale blok en het centrale blok zelf

[ Voor 39% gewijzigd door Rowanov op 28-05-2007 20:25 ]

[mcdronkz]

Dat werkt prima. Dank daarvoor.

Echter stuit ik op nog een probleem bij het positioneren binnen IE. Ik maak een span die ik zowel verticaal als horizontaal wil centreren, dat gaat wederom in FF goed, maar in IE gaat het mis bij het horizontaal centreren.

http://mcdronkz.ath.cx:1337/wfd/2

[Rowanov]

Ik zie dat je de container een relatieve width geeft; dat moet je niet doen, want dan stort de hele meuk in op een aantal resoluties. Ik zou daar de afmetingen weglaten, want het doet niet echt veel.

Het verticaal en horizontaal centreren van die span hoeft niet al te moeilijk te zijn. Het zou moeten werken als je de span een line-height: 145px; geeft en het element waar je span in staat een text-align: center;. Die zut die je nu hebt neergezet met position absolute etc. zou ik snel weggooien