토론방

디자인팜2.0 상단 네비게이션 오류

안녕하세요 여기 홈페이지 인사말 카테고리(맨처음 대카테고리) 눌렀을때 상단 바가 움직입니다, 

원래 시안확인해보니 시안도 같은 현상이 발생하고 있습니다, 수정부탁드립니다. 감사합니다

게시글 공유 URL복사
댓글[3]

열기 닫기

  • P**M 2018-07-03

    인사말 페이지에 내용이 없어서 발생하는 증상입니다.

    다른페이지는 모두 내용이 길어 가로 스크롤이 생긴상태인데요

    인사말만 내용이 없다보니 가로스크롤이 생기지 않았습니다.

    그로 인해 상단부분이 조금 다르게 보이는 부분입니다.

     

    인사말 부분에 내용을 채워주시면 이러한 증상은 발생하지 않을겁니다.

     

  • s**c 2018-07-03
    안녕하세요. 인사말에 내용이 있는데도 인사말 페이지에 들어가면 로고 위치가 바뀝니다, 확인부탁드립니다 감사합니다
  • 이**우 2018-07-03

    인사말, COMMUNITY - 정상출력

    애견카페, 애견유치원, 애견목욕, 애견호텔 - 비정상출력

     

    -------------------------------------------------------------------------------------------

     

    비정상출력되는 페이지들에 공통적으로 들어가는 내용들이 있습니다.

     

    다음과 같은 형식의 모든 타이틀 텍스트의 소스에 문제가 있습니다.

    .title__9771__ {font-size:0}
    .title__9771__ p {
        display:inline-block;position:relative;margin:0;padding:0;
        font-size:{$farm_set[font_size_m]}px;font-weight:{$farm_set[weight]};color:{$farm_set[color]};letter-spacing:-.03em;line-height:1.4em;
    }
    .title__9771__ p:before {content:'';position:absolute;background:{$farm_set[style_color]};font-size:0}

    .title__9771__.style_top p {padding-top:10px}
    .title__9771__.style_top p:before {top:0;left:0;width:{$farm_set[font_size_m]}px;height:4px}

    .title__9771__.style_right p {padding-right:14px}
    .title__9771__.style_right p:before {top:16%;right:0;width:4px;height:{$farm_set[font_size_m]}px}

    .title__9771__.style_bottom p {padding-bottom:12px}
    .title__9771__.style_bottom p:before {bottom:0;left:0;width:{$farm_set[font_size_m]}px;height:4px}

    .title__9771__.style_left p {padding-left:14px}
    .title__9771__.style_left p:before {top:16%;left:0;width:4px;height:{$farm_set[font_size_m]}px}

    .title__9771__.style_circle1 p {padding-left:18px}
    .title__9771__.style_circle1 p:before {
        top:0;bottom:0;left:0;width:10px;height:10px;margin:auto;border-radius:50%;
    }

    .title__9771__.style_circle2 p {padding-left:18px}
    .title__9771__.style_circle2 p:before {
        top:0;bottom:0;left:0;width:10px;height:10px;margin:auto;border-radius:50%;
        border:2px solid {$farm_set[style_color]};background:none;box-sizing:border-box;
    }
    span{color:#777; font-weight:lighter; font-size:14px;padding-left:8px;}

    @media all and (min-width:102*px){
        .title__9771__ p {font-size:{$farm_set[font_size]}px}
        .title__9771__.style_top p:before {width:{$farm_set[font_size]}px}
        .title__9771__.style_right p:before {height:{$farm_set[font_size]}px}
        .title__9771__.style_bottom p:before {width:{$farm_set[font_size]}px}
        .title__9771__.style_left p:before {height:{$farm_set[font_size]}px}
    }

     

     

    -------------------------------------------------------------------------------------------

     

    # 설명

     

    위와 같은 형식으로 소스를 작성하실 경우,

    사이트내의 모든 <span> 에 적용됩니다. (현재 화면에 보여지는 모든 span)

     

    로고 부분에도 <span> 이 사용되고 있어서 padding-left:8px 이 적용되어서 로고가 움직이는 것처럼 보이게 됩니다.

     

    -------------------------------------------------------------------------------------------

     

     

    # 수정방법

     

    타이틀 텍스트의 소스에는 <span>이 포함되어 있지 않습니다.

    모든 타이틀 텍스트에서 위의 css 소스를 삭제한 후, 해당 css 가 필요한 곳에만 적용하시기 바랍니다.

     

     

댓글작성

열기 닫기

댓글작성
top