IT이야기

DIV를 항상 오른쪽 상단의 화면에 떠있게 만드는 방법

cyworld 2021. 4. 27. 21:55
반응형

DIV를 항상 오른쪽 상단의 화면에 떠있게 만드는 방법은 무엇입니까?


페이지를 아래로 스크롤해도 DIV가 동일한 고정 위치에 계속 표시되도록 DIV를 항상 화면의 오른쪽 상단 모서리에 플로팅하려면 어떻게해야합니까? 감사.


을 사용 하고 페이지 측면에 position: fixed고정합니다 .topright

#fixed-div {
    position: fixed;
    top: 1em;
    right: 1em;
}

position: fixed그러나 IE6는를 지원하지 않습니다 . IE6에서이 기능이 필요한 경우이 순수 CSS 솔루션 이 트릭을 수행하는 것 같습니다. 스타일 시트<div> 에서 볼 수 있듯이 작동하려면 일부 스타일을 포함 하는 래퍼 필요합니다 .


사용은 position:fixed, 이전에 언급 한 바와 같이, IE6는 인식하지 못하는 position:fixed,하지만 일부 CSS의 마법 당신은 IE6의 행동을 얻을 수 있습니다 :

html, body {
    height: 100%;
    overflow:auto;
}
body #fixedElement {
    position:fixed !important;
    position: absolute; /*ie6 */
    bottom: 0;
}

!important당신이 IE를위한 조건부 주석을 사용하지 않아도 플래그는한다. 이것은해야합니다 #fixedElement사용하는 position:fixed모든 브라우저하지만 IE에서, 그리고에서 IE, position:absolute함께 적용됩니다 bottom:0. 이것은 position:fixedIE6에 대해 시뮬레이션 합니다.

참조 URL : https://stackoverflow.com/questions/4236151/how-to-make-a-div-always-float-on-the-screen-in-top-right-corner

반응형