<td> 항목이 너무 많아 모바일에서 안보입니다

<td> 항목이 너무 많아 모바일에서 안보입니다

QA

<td> 항목이 너무 많아 모바일에서 안보입니다

본문

8304951d9e88cf271add485c3b182f5f_1467531100_1361.png
<td> ... </td> 안에 너무 많은 체크박스를 넣어서

pc화면에서는 괜찮은데 모바일에서는 td안의 내용이 잘려서 안보이는 부분이 생깁니다.

<table width="100%"> 로 하면 모바일에서 잘리진 않지만 <tr>기타 이부분옆에 표시되지 않고 아래에 표시되네요.

화면 크기에 따라서 반응형으로 만들려면 어떻게 해야 할까요?

도움 부탁드립니다.

 


<tr><th scope="row"><label for="wr_14"><?php _e('기타', GC_NAME);?><strong class="sound_only"><?php _e('필수', GC_NAME);?></strong></label></th>
<td>
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
</td></tr>

이 질문에 댓글 쓰기 :

답변 2

중간에 div 로 감싸고 div style 에 width 값을 100%로 줘보세요.

 


<style>
#widthauto { width:100%;}
</style>
 
<table>
<tr><th scope="row"><label for="wr_14"><?php _e('기타', GC_NAME);?><strong class="sound_only"><?php _e('필수', GC_NAME);?></strong></label></th>
<td>
  <div id="widthauto">
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
<input type="checkbox" name="wr_14" value="test">test
  </div>
</td></tr>
</table>

반응형으로 하시려면 div,span 내지는 li 로 처리하시면 됩니다.   

답변을 작성하시기 전에 로그인 해주세요.
전체 15
QA 내용 검색
filter #표 ×

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT