질문/조언질답게시판
Extra Form
PHP PHP 7.1
CMS XpressEngine

스케치북 게시판 웹진형에서 카드테두리로 사용히 모바일에서는 카드형태를 100%로 화면사이즈에 맞추지 못하나요?

css는 백날 손대도 안데던데요... 정말 이것땜시 환장하겠네요.ㅠ.ㅠ

 

!스케치북1.JPEG

위에가 pc화면이고요.

 

아래가 모바일에서 보이는 화면입니다.

!스케치북2.JPEG

스케치북3.JPEG

 

이런형태인데 모바일에서 카드 형태를 100%꽉차게 바꿀수있는 방법이 어떤것들이 있을까요?

크롬 개발자모드에서 아무리 CSS를 변경하고 몬짓을 해도 안되네요.ㅠㅠ.

  • ?
    이건 웹진형이 아닌걸로 알고있습니다.
    클라우드갤러리 아닌가요?
  • ? ?

    웹진형 카드 테두리 맞습니다^^ 스샷에도 보이실텐데요?ㅠ.ㅠ

  • ? ?
    아 카드스타일이 있군요~
  • ?
    아플로스 게시판 스킨 사용해 보세요
    카드형 선택하시고 반응형으로 너비에 따라 가로 아이템 갯수를 설정할 수 있습니다
  • ?
    요약부분때문에 그런것 같습니다.
    sketchbook5/css/board.css 파일에서
    .bd_zine.card .cnt{margin-top:1em;font-size:11px} 이부분을 아래와 같이 바꿔주시면 됩니다.

    .bd_zine.card .cnt{margin-top:1em;font-size:11px;height:18px;display: -webkit-box; -webkit-line-clamp: 1;-webkit-box-orient: vertical;text-overflow: ellipsis;word-wrap: break-word;overflow: hidden;}

    이렇게 하면 요약부분이 한줄로만 나옵니다.
  • ? ?

    !모바일화면.JPEG

    그렇게 바꿔봐도 화면에 꽉차지는 않네요.ㅠ.ㅠ 모바일에서는 그냥 하나씩 보이는건 같네요. 화면에 꽉차고 패딩10px정도씩 줘서 꽉차게 보일려고 했는데 아무리해도 안되네요 그건.ㅠ.ㅠ

  • ? ?

    아 질문이 이거였군요 ㅠ 제가 잘못봤네요

     

    sketchbook5/__setting.html 파일에서

    @media screen and (max-width:480px){
    <[email protected]($mi->zine_thumb_width > 399)-->
    .bd_zine.card li{width:400px}
    <[email protected]($mi->zine_thumb_width > 139)-->
    .bd_zine.card li{width:200px}
    <[email protected]>
    .bd_zine.card li{width:116px}
    <[email protected]>
    }

    를 아래처럼 바꾸면 됩니다.

    @media screen and (max-width:480px){
    <[email protected]($mi->zine_thumb_width > 399)-->
    .bd_zine.card li{width:400px}
    <[email protected]($mi->zine_thumb_width > 139)-->
    .bd_zine.card li{width:calc( 100% - 32px );}
    <[email protected]>
    .bd_zine.card li{width:116px}
    <[email protected]>
    }

  • ? ?

    !스케치북모바일2.JPEG

     

    헛 정말로 감사드립니다. 전 계속 CSS파일만 들여다보고 있었는데 말이죠. 감사합니다.^^


서버에 요청 중입니다. 잠시만 기다려 주십시오...