모바일 하단 메뉴 버튼 이용 하시는 분들 질문이용

질문과 답변

2024.12.01 13:44

모바일 하단 메뉴 버튼 이용 하시는 분들 질문이용

우루사100mg미니홈 1:1 대화하기 오래 전 2024.12.01 13:44 인기
291

1

https://rebuilder.co.kr/userdata/1 토대로 모바일 하단 버튼 적용이 잘됐습니다. 그런데 pc에서는 메뉴 아이콘이 하단에 대빵만하게 보이네요.

/www/theme/rb.basic/rb.css/mobile.css

footer .footer_copy_ul2 {float:none; text-align: center; margin-top: 30px;}

위 코드 아래 부분에 적용 함

css 코드 적용 잘 한건지 봐주시면 감사하겠습니다.^^

/* 하단메뉴 버튼시작*/
    .footer_nav {
        backdrop-filter: blur(4px);
        background: #ffffffeb;
        border-top: 1px solid #f1f2f4;
        bottom: 0;
        height: 64px;
        left: 0;
        padding: 0 8px;
        position: fixed;
        width: 100%;
        z-index: 1000;
        transition: all .4s ease-out;
        transform: translate3d(0,64px,0);
    }
    .footer_nav .footer_nav_grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        height: 100%;
    }
    .footer_nav .footer_nav_grid_item {
        align-items: center;
        color: #48546e;
        cursor: pointer;
        display: flex;
        flex-direction: column;
        font-size: 10px;
        font-weight: 500;
        gap: 2px;
        justify-content: center;
    }
    .footer_nav .footer_nav_grid_item.active {
        color: #091227;
        font-weight: 800;
    }
    .footer_nav .footer_nav_grid_item i {
        display: inline-block;
        height: 22px;
        width: 22px;
    }
    .footer_nav .footer_nav_grid_item i svg {
    
    }
    .footer_nav .footer_nav_grid_item span {
        display: block;
    }

    @media all and (max-width: 768px) {
        .top_nav {display: flex !important;}
        .footer_nav {transform: translateZ(0) !important;}
    }
    
    
    /* 하단메뉴버튼 끝 */