원더풀 제품소개 스킨 2가지 질문드립니다.

KBoard 원더풀 제품소개 스킨 정렬관련 질문드립니다.

https://imgur.com/EU434Pq

또하나는 모바일화면에서

한줄에 2개씩 정렬이 안되고

화면같이 빈공간이 생깁니다.

2

1

2

https://imgur.com/Txn5f95

좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기
좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기
  • 안녕하세요~^^

    스킨을 직접 커스터마이징 하신 것 같습니다.

    이 경우 100% 도움을 드리지 못할 수 있습니다.

    CSS 문제의 경우에는 이미지만 보고는 판단할 수 없기 때문에 실제 확인 가능한 페이지 주소를 알려주시겠어요?

    브라우저로 접속해 확인해보겠습니다.

    고맙습니다.

  • 확인가능하신 주소 링크관련
    윗글 확인좀 부탁드립니다!

  • 안녕하세요.

    기존 수정하신 코드 중 padding-bottom 속성을 추가한

    div 태그에 line-height 속성도 추가해서 확인해보시겠어요?

    https://imgur.com/a/Ai8ODO8

     

    수정하신 코드를 잘 확인하셔서

    태그의 열고 닫힘도 정상적인지도 확인해보셔야 할 듯합니다.

    고맙습니다.

  • 모바일에서 한 줄에 한 개씩 표시하고

    PC에서는 한 줄에 3개씩 표시하시려면

    아래의 CSS 코드로 확인해보시겠어요?

    #kboard-wonderful-product-list .kboard-list .kboard-list-item { width: 32%; }
    
    @media screen and (max-width: 600px) {
        #kboard-wonderful-product-list .kboard-list .kboard-list-item {margin: 0;width: 100%;}
    }

     

    해당 페이지에서 크롬 브라우저 개발자 도구(F12)로 확인해보면

    <font> 태그가 몇 군데 추가되어 있는 듯합니다.

    해당 태그로 문제로 인해 CSS 코드를 적용하더라도 레이아웃이 깨질 수도 있습니다.

     

    KBoard 스킨 수정 시 HTML 태그 열고 닫힘을 천천히 확인해보시고

    다른 쪽도 수정하셨다면 잘 확인해보셔야 할 듯합니다.

    고맙습니다.

  • 답변문의를 드리는 순간에 답변을 달아주셨네요.. 감사합니다.^^
    모바일문제는  해결하였습니다.
    line-height 속성을 넣어도 

    아래 부분의 문제가 해결이 안되네요.. 

    제가 어딜 건드렸는지 헷갈리네요ㅜㅜ;;

     

     

     

  • 이전 댓글에 설명드린 것처럼 직접 커스텀을 하신 경우

    저희 쪽에서 100% 도움을 드리기 어렵습니다.

    또한 현재 <font> 태그가 불필요한 곳에 추가되어 있기 때문에

    수정하신 코드를 확인해주셔야 할 듯합니다.

    임시방편으로는 line-height 속성의 픽셀 값을 낮춰서도 확인해보시겠어요?

    고맙습니다.

이미지 사진은 imgur에 업로드한 뒤 링크 걸어주세요.
좋은 정보와 인맥을 동시에, 워드프레스 사용자 단톡방 참여하기