Beste allemaal,

Zoals ik in een ander topic al aangaf ben ik de laatste tijd bezig geweest met de ontwikkeling van een nieuw portfolio (www.geertvansoest.nl).

Om de verschillende projecten (homepage) en elementen (andere pagina's) naast en onder te plaatsen heb ik gebruik gemaakt van Masonry (zie: masonry.desandro.com).

In Safari (en alleen in Safari!) is de marge van de 'echte content' aan de bovenkant op de homepage (en alleen op de homepage!) echter groter dan bij de andere pagina's (zie de rode lijn op de afbeelding), terwijl hij onderaan kleiner is. Ik heb al van alles geprobeerd, maar heb de oorzaak niet kunnen vinden.

Iemand die me verder kan helpen?
Het lijkt wel of hij de padding van de '#portfolio .content' op de homepage daar twee keer toekent aan de bovenkant.



Groetjes,
Geert
Het probleem is inmiddels opgelost.

De "container" had een procentuele padding. Alleen waar alle browsers bij alle percentages de breedte als basis nemen is Safari de enige die uitgaat van de hoogte (bij de top- en bottom-padding). En omdat de totale hoogte op de homepage veel hoger is dan bij de andere pagina's was daar de afstand aan de bovenkant groter dus ook groter. Ik het opgelost door de afstand via jQuery te berekenen.

Topic kan dus dicht.
Is het niet beter/makkelijk om dan in em de hoogte op te geven? Of desnoods in pixels?

Nu ga je HTML downloaden, CSS toevoegen, Javascript uitrekenen, CSS aanpassen...
Eerst gebruikte ik 'gewoon' pixels aan de bovenkant. Maar wat ik wil is dat (vooral op de homepage) de tussenruimte tussen de 'blokken' overal net zo groot is (zoals nu dus het geval is), dus zowel in de breedte als de hoogte. Daarom heb ik het nu via jQuery gedaan. Die berekend de breedte van de container en geeft daar een percentage van mee aan zowel de verticale als horizontale margin danwel padding.

Reageren