nicht angemeldet
Rolf BHallo mixmastertobsi,
da hast Du einen ganzen Schwarm Probleme auf einmal.
- display:inline-block im parent + position:fixed im child
Durch den position:fixed auf dem span wird der Span von der Größenberechnung für das div ausgenommne. Das siehst Du, es hat keine Höhe. Durch das inline-block werden die beiden divs an Hand der Text-Baseline angeordnet. Das siehst Du auch, wenn Du den divs ein text-align:right gibst: Die Unterkante des Textes, der die top-Position des linken divs angibt, und der Rahmen des rechten, leeren div sind bündig. Dadurch ist die Top-Position des rechten div tiefer als die des rechten und du hast zusätzliches Y drin.
- transform:translate und position:fixed
Hier hilft Tante Google (transform position fixed) und verweist auf StackOverflow, und von da auf die Spec zu transform. position:fixed bezieht die Elementposition normalerweise auf den Viewport, aber wenn ein transform-tes Element Parent ist, bezieht sich fixed auf dieses Parent-Element. Die top-Eigenschaft ebenfalls. Willst Du ein Element auf den Viewport fixen, musst Du es aus dem transform-ten div herausholen.
Rolf
sumpsi - posui - clusi