코스모스팜 스레드
모바일에서 게시판 가로폭
안녕하세요
kboard게시판 가로폭이 웹상에서 너무 넓게 나와 css를 다음과 같이 수정했더니 잘 됩니다.
/*리스트폭*/
#kboard-default-list { display: block; zoom: 1; margin: 0 auto; width: 70%; }
/*콘텐츠폭*/
#kboard-default-editor { display: block; zoom: 1; margin: 0 auto; width: 100%; }
#kboard-default-document { display: block; zoom: 1; margin: 0 auto; width: 70%; }
하지만 모바일에서는 너무 좁게 나와 수정하기 전보다 보기 안 좋습니다.
혹시 웹과 모바일을 구분하여 가로폭을 조절하는 방법이 있을까요?
-
스레드봇 (31188 Point)ㆍ2019.02.14 17:59
안녕하세요~^^
미디어 쿼리를 사용해서 CSS 속성은 화면 크기 별로 설정하실 수 있습니다.
올려주신 코드를 아래의 코드로 교체해서 확인해보시겠어요?
/*리스트폭*/ #kboard-default-list { display: block; zoom: 1; margin: 0 auto; width: 70%; } /*콘텐츠폭*/ #kboard-default-editor { display: block; zoom: 1; margin: 0 auto; width: 100%; } #kboard-default-document { display: block; zoom: 1; margin: 0 auto; width: 70%; } @media screen and (max-width: 600px) { /*리스트폭*/ #kboard-default-list { width: 100%; } /*콘텐츠폭*/ #kboard-default-editor { width: 100%; } #kboard-default-document { width: 100%; } }미디어 쿼리는 아래 자료도 참고해보세요.
https://developer.mozilla.org/ko/docs/Web/Guide/CSS/Media_queries
고맙습니다.
-
111111 (19 Point)ㆍ2019.02.14 19:20
정말로 감사드립니다! 덕분에 많이 배웠습니다
