토론방

소스관련 대메뉴수정

대메뉴가 왼쪽은 글이 길어서 간격이 좁고.. 오른쪽은 짧아서 간격이 넓습니다.
간격을 똑같이 하려고 하려면 어떻게 하나요?
게시글 공유 URL복사
댓글[1]

열기 닫기

  • 이**우 2018-10-29

    # 스킨 소스 (PC 메인 스킨, PC 서브 스킨)

    - 가로 크기가 균등하게 % 로 들어가는 부분을 삭제해주세요.

     

    <div id="lnb_p" class="lnb_p">
        <!-- 1 Depth -->
        <ul class="dep1">
            <!--@foreach($navi_category_menu[sub_menu] as $k=>$v)-->
            <li cond="$v[visible]" class="on"|cond="$v[code]==$NAVI_INFO[code] || $v[code]==$NAVI_INFO[parent]" style="width:{$lnb_width}">
                <div class="dep1_li_inner">
                    <a href="{$v[link_url]}" target="{$v[link_target]}"|cond="$v[link_target]">{$v[subject]}</a>
                    <div cond="$v[sub_count]">
                        <!-- 2 Depth -->
                        <ul class="dep2">
                            <!--@foreach($v[sub_menu] as $k2=>$v2)-->
                            <li cond="$v2[visible]" class="on"|cond="$v2[code]==$NAVI_INFO[code]">
                                <a href="{$v2[link_url]}" target="{$v2[link_target]}"|cond="$v2[link_target]">{$v2[subject]}</a>
                            </li>
                            <!--@end-->
                        </ul>
                        <!-- // 2 Depth -->
                    </div>
                </div>
            </li>
            <!--@end-->
        </ul>
        <!-- // 1 Depth -->
    </div>

     


     

    # CSS 소스 (pc_ksin_869_557.css)

    - 적절한 간격이 되도록 여백을 조절해주세요.

     

        .lnb_p {display:table-cell;position:relative;z-index:1200;vertical-align:top}
        .lnb_p ul {margin:0;padding:0;list-style:none}
        .lnb_p a {display:block}
        .lnb_p .dep1:after {clear:both;content:'';display:block}
        .lnb_p .dep1 > li {box-sizing:border-box;float:left;padding:0 1px}
        .lnb_p .dep1 > li .dep1_li_inner {position:relative}
        .lnb_p .dep1 > li .dep1_li_inner > a {overflow:hidden;position:relative;height:55px;line-height:55px;padding:0 10px;font-size:13px;font-weight:bold;color:#000;text-align:center;white-space:nowrap;text-overflow:ellipsis;letter-spacing:-.03em;text-transform:capitalize}
        .lnb_p .dep1 > li .dep1_li_inner > a:before {content:'';position:absolute;bottom:0;right:0;left:0;width:100%;height:3px;background:#a2c5e0;z-index:10;opacity:0}
        .lnb_p .dep1 > li.on .dep1_li_inner > a,
        .lnb_p .dep1 > li:hover .dep1_li_inner > a {color:#2B7DBC}
        .lnb_p .dep1 > li:hover .dep1_li_inner > a:before {opacity:1}
        .lnb_p .dep1 > li .dep1_li_inner > div {box-sizing:border-box;display:none;position:absolute;min-width:100%;padding:5px 0;border:1px solid #dddddd;border-top:none;background:#ffffff}
        .lnb_p .dep2 {padding:8px 0;border-top:none;box-sizing:border-box;font-size:0;white-space:nowrap}
        /* dep2 li가 가로로 정렬일때 display:inline-block 적용하면 script도 자동 활성화 */
        /*.lnb_p .dep2 > li {display:inline-block}*/
        .lnb_p .dep2 > li > a {overflow:hidden;position:relative;padding:5px 10px;font-size:14px;font-weight:normal;color:#74757b;text-align:center;white-space:nowrap;text-overflow:ellipsis;text-transform:capitalize}
        .lnb_p .dep2 > li.on > a,
        .lnb_p .dep2 > li:hover > a {color:#a2c5e0;text-decoration:underline}

댓글작성

열기 닫기

댓글작성
top