아이디 클라스 같이 적용할때 유의하자!

백투탑, 아이콘 안나옴,,,,시간을 꽤 잡아먹었는데,,,
폰트어썸 문제인줄
알고보니

픽스해놓은 a태그가 문서 밖으로 나가면서
after로 했을때 원하는 위치에 잘 보여졌어야하는데

선택자 띄어쓰기 되어있어서 아이콘 안 나왔었음.

id와 클라스를 같이 쓰고
id는 hidden
class 는 visible했을때

선택자를 id와 클라스 같이 붙혀서 썼어야함.

#backtotop.show 이렇게
#backtotop .show -> 습관으로 클라스명 적을때
한 칸 띄었더니 안 나왔던 것.

/* back to top */
#backtotop {
    background-color: rgb(47, 48, 89);
    width: 40px;
    height: 40px;
    text-align: center;
    border-radius: 20px;
    position: fixed;
    bottom: 30px;
    right: 30px;
    transition-property: background-color, opacity, visibility;
    transition-duration: 0.3s, 0.5s, 0.5s;
    opacity: 0;
    visibility: hidden;
    z-index: 99999;
}

#backtotop::after {
    content: "\f35b";
    font-family: FontAwesome;
    font-weight: 900;
    font-size: 1.5rem;
    line-height: 40px;
    color: #fff;
}

#backtotop.show {
    opacity: 1;
    visibility: visible;
    background-color: rgb(47, 48, 49);
}

유의하기