position sticky

[현정]

position sticky 관해 질문올립니다!

.section2 { height: 21000px;}
.sticky-content { height: 2000px; margin-top:100px;}
.sticky-img { float:right; width: 100%;; position:sticky; top:100px;}
.sticky-text { float:left; width:500px;}

 <div class="section2">
            <div class="sticky-content">
                <div class="sticky-img">
                   
                </div>
                <div style="clear:both"></div>
                <div class="sticky-text">
                    <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam inventore accusantium nulla rerum obcaecati sint soluta ut adipisci optio quibusdam necessitatibus</p>
                </div>
                <div style="clear:both"></div>
                <div class="sticky-text">
                    <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam inventore accusantium nulla rerum obcaecati sint soluta ut adipisci optio quibusdam necessitatibus</p>
                </div>
                <div style="clear:both"></div>
                <div class="sticky-text">
                    <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Numquam inventore accusantium nulla rerum obcaecati sint soluta ut adipisci optio quibusdam necessitatibus</p>
                </div>
            </div>

이렇게해서 높이설정을 하니 높이스타일이 적용이 안되는데 왜그럴까요ㅠ

위에 다른 요소들때문에 적용이 안되는건가요

[현정]

구글링해보니 조상이나 부모중에 overflow:hidden 속성이 있으면  position sticky를 사용할수없다고하는데 어떻게해야될까요 이걸 대체할만한게 있을까요ㅠ  강의에서 애플사이트를 참조할려고 봤더니 sticky를 써서 한건 아닌거같아서여

[codingapple]

css가 불가능하면 자바스크립트로 구현하는 방법밖에는 없습니다 

[글쓴이]

글