Hoe Position fixed te beperken tot één DIV element
Als ik nu naar beneden scroll blijft div a keurig staan. Echter kom ik aan bij de footer dan schuift hij ook dáárover heen. Dat wil ik niet.
Met andere woorden ik zou willen dat als div a de onderzijde bereikt van div b, dat hij dan niet meer fixed is, maar weer verder mee omhoog schuift.
Kan iemand mij uit de brand helpen?
position: sticky wat je zoekt?
Is Het gaat er hier om dat als de onderzijde van het omvattende div element wordt bereikt de fixed ahw wordt opgeheven.
eerste resultaat.
fixed haalt elementen uit de flow, maar tegenwoordig is het blijkbaar wel (tot op zekere hoogte, pun intended :p) mogelijk om deze relatief ten opzichte van iets te positioneren.
En als dit niet op te lossen valt met een 100% CSS oplossing is daar altijd nog JavaScript.
Google "css fixed element within container", fixed haalt elementen uit de flow, maar tegenwoordig is het blijkbaar wel (tot op zekere hoogte, pun intended :p) mogelijk om deze relatief ten opzichte van iets te positioneren.
En als dit niet op te lossen valt met een 100% CSS oplossing is daar altijd nog JavaScript.
Maar toen bleek het volgende probleem: als de div korter is dan de div ernaast en je scrollt naar benenden dan scrollt hij op enig moment toch mee naar boven en verdwijnt hij. Wat er dus ook nog moet gebeuren is dat de betreffende div, als die naast andere divs staat, even lang moet zijn als de langste div.
Daar zijn ingewikkelde oplossingen voor. Ik heb een makkelijke gevonden door de omvattende div position:relative; te geven en de betreffende div position:absolute; bottom: 0px; right: 0px; en height: 100%;
werkt perfect.
Thx
Quote:
Wat er dus ook nog moet gebeuren is dat de betreffende div, als die naast andere divs staat, even lang moet zijn als de langste div.
Dit een ander specifiek en redelijk bekend CSS-probleem, die ook weer een andere oplossing heeft inderdaad.
Thomas van den Heuvel op 30/01/2019 17:01:59:
Dit een ander specifiek en redelijk bekend CSS-probleem, die ook weer een andere oplossing heeft inderdaad.
Maar: negeer alles van voor 2017 -> flexbox!