아이폰 테이블 깨짐 현상

아이폰 테이블 깨짐 현상

QA

아이폰 테이블 깨짐 현상

답변 1

본문

table td 에 min-width (200px)도 줬는데 테이블이 깨집니다...


<table border="1" summary="">
<caption>공지사항 목록</caption>
    <tbody class="xans-element- xans-board xans-board-list-1 xans-board-list xans-board-1"><!--
            $count = 4
            $main_list = yes
            $subject_cut = 25
            $main_list_reply_view = no
         --><tr class="xans-record-">
<td class="title">
<a href="/board/free/read.html?no=34&board_no=1">THE CLASSIC PILATES SHOWR</a> <img src="http://img.echosting.cafe24.com/design/skin/admin/ko_KR/ico_attach2.gif" alt="파일첨부" class="ec-common-rwd-image"></td>
            <td class="date ">22.04.25</td>
        </tr>
<tr class="xans-record-">
<td class="title">
<a href="/board/free/read.html?no=25&board_no=1">Retro Classic 사전 예약 이벤트</a> <img src="http://img.echosting.cafe24.com/design/skin/admin/ko_KR/ico_attach2.gif" alt="파일첨부" class="ec-common-rwd-image"></td>
            <td class="date ">22.04.19</td>
        </tr>
<tr class="xans-record-">
<td class="title">
<a href="/board/free/read.html?no=23&board_no=1">클래식 필라테스 스튜디오 창업 컨설팅</a> <img src="http://img.echosting.cafe24.com/design/skin/admin/ko_KR/ico_attach2.gif" alt="파일첨부" class="ec-common-rwd-image"></td>
            <td class="date ">22.04.18</td>
        </tr>
</tbody>
</table>
<style>
 .title {width:calc(100% - 50px);min-width:200px;}
</style>

근데 어디서 문제가 생긴건지 확인할 방법이 없네요.

사파리 문제인가 싶어서 아이폰에서 네이버 앱으로 확인했는데도 깨지네요 ㅠㅠ

왜 이러는지 아시는 분 있을까요?

 

3695953000_1651799946.4608.jpg

 

* PC로 아이폰 화면을 테스트 할 수 있는 방법이 있을까요?

이 질문에 댓글 쓰기 :

답변 1

크롬으로 페이지를 여신 후 소스보기 누르신 뒤에 모바일환경으로 보는 방법이 있습니다.

현재 class 에 어떤 style이 들어가 있는지 모르실 경우 소스보기로 table td 들을 찍어보시면

해당 css가 나타납니다.

css를 확인해야될듯합니다.

title 에 100% - 50px 이 있으실텐데 그전에 table의 width 조건을 확인해보세요

아무조건도 없는 상태에서 table의 width는 100%의 영역을 가지고 있지는 않습니다.

table위의 div에 width 가 지정되어있고 table width 100%이 적용되어있습니다.
구글링해보니까 <td nowrap>...</td>이라고 적용하면 줄바꿈이 되지 않는다고 해서 현재 그걸로 잡아두니 아이폰에서 정상적으로 나오네요. 답변 감사드립니다!

답변을 작성하시기 전에 로그인 해주세요.
QA 내용 검색
질문등록
filter #html ×
전체 1,125
© SIRSOFT
현재 페이지 제일 처음으로