지금 pc화면에는 이렇게 적용되어있는데
모바일로 들어가보니 이렇게 나옵니다. pc는 ※ 이 버튼을 누르면 오늘의 일정목록이 나오는데
모바일로 들어가보면 그것이 나오지 않습니다 혹시 원인에 대해 알 수 있을까요?
http://www.etj.co.kr/bbs/board.php?bo_table=test&t=20190522&year=2019&month=5
답변 5개 / 댓글 12개
아르키어드
레이아웃은 반응형으로 다시잡으셔야겠지만..각 td들에 스타일 word-break주었습니다.
텍스트 길이가 width값을 넘쳐서 생긴 현상같습니다. word-break로 텍스트길이가 width값을 벗어나면 줄넘김 시켰습니다
답변에 대한 댓글 3개
작성해주신 링크에서 개발자 도구를 가서 수정해보았습니다.
그리고 너무 많아서 밑부분 TR 은 잠시 지우고 테스트 해보았습니다.
이제 가로 길이가 각각 동일하쥬?
답변에 대한 댓글 4개
저 부분을 모두 포함하는 table 의 cellpadding 부분의 변화를 주니 애들이 재정렬을 하더라고요
솔직히 맞는지는 잘 모르겠지만 thead 에 th 부분에 각각 width 값을 부여했습니다.
그래도 혹시 몰라 소스 남겨봅니다.
<td width="14%" height="80" bgcolor="#ffffff" valign="top"><a href="./board.php?bo_table=test&t=&year=2019&month=5" title="일정보기">※</a> <font color="blue">25</font><font color="gray"> (음)4.21</font> <font color=""></font> </td>
이 부분을
<td width="14%" height="80" bgcolor="#ffffff" valign="top"><a href="./board.php?bo_table=test&t=&year=2019&month=5" title="일정보기">※</a> <font color="blue">25</font><br><font color="gray"> (음)4.21</font> <font color=""></font> </td>
잘 보시면 날짜 뒤 음력 날짜가 나오면 br 태그로 내려버리시면 잘나오는데..;;근본적인 해결방법이 아닌것같네요..죄송합니다.
아 질문글을 이해하지 못했네요.
이미 사전 반응형 작업이 되어있는줄 알았네요.
해당 url 들어가보니 모바일 페이지 코딩이 안되어있으시던데 맞나요?
모바일 접속시 이렇게 나옵니다.
답변에 대한 댓글 1개
각각의 칸에 width 를 %로 분할해서 주시면 되지않을까요??
100% / 7 = 약 14%
답변에 대한 댓글 3개
이렇게 14%각각 되어있는 것 같은데, 아무래도 저 공간 내의 어떤 것의 최소길이가 고정되어있어서 그런 것 같은데... 그걸 모르겠어요 공휴일 써있는 세로줄만 저렇게 안줄어들었더라구요
그럼 어디에서 min-width 가 잡혔는지 알수 있습니다.
그누보드 페이지가 아닌 별도로 만든 페이지라면
뷰포트 설정이 안되어 있는것 같네요.
<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=0,maximum-scale=10,user-scalable=yes">
이렇게 선언해주셔야 할것 같습니다.
답변에 대한 댓글 1개
답변을 작성하려면 로그인이 필요합니다.