css 위치 속성에 관한 간단한 질문

css 위치 속성에 관한 간단한 질문

QA

css 위치 속성에 관한 간단한 질문

본문

32764334_1588516669.6797.png32764334_1588516740.6464.png

 

hover 선택자를 이용해서 마우스 올리면 저런식으로 바뀌게 하고 싶어서

 #two:hover {

            position: absolute;

            top: 20px;

            left: 20px;

            background-color:green;

            color: white;

            text-align: center;

        }

        #five:hover {

            position: absolute;

            bottom: 20px;

            right: 20px;

            background-color:green;

            color: white;

            text-align: center;

        }

이렇게 소스코드를 작성했습니다. 제가 알고 있기로는 top: 양수px  - 상단기준. 아래로 이동

bottom: 양수px  - 하단기준.   위로 이동 , left: 양수px - 좌측기준. 오른쪽으로 이동 이여서

저렇게 작성했는데 의도한 것과는 다른 방향으로 움직이네요 ㅜㅜ 심지어 두번째거는 엄청 아래로 많이

내려가고요... 뭐가 문제인걸까요???

이 질문에 댓글 쓰기 :

답변 3

그냥 bottom 을 하면 사이트하단을 기준으로 위로 20이 됩니다..

 

원하시는 곳에 전체를 박스를 한번 쒸우시고 그 안에서만 움직이게 하는것이 좋겠습니다..

저 빨간것들을 감싸고 있는 부모요소에 relative가 들어가야합니다

답변을 작성하시기 전에 로그인 해주세요.
전체 424
QA 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT