table을 쓰지 않는 레이아웃 스킨 가운데 댓글 문제 해결 방안 > 그누4 팁자료실

매출이 오르면 내리는 수수료! 지금 수수료센터에서 전자결제(PG)수수료 비교견적 신청해 보세요!

그누4 팁자료실

그누보드4와 관련된 팁을 여러분들과 함께 공유하세요.
나누면 즐거움이 커집니다.

table을 쓰지 않는 레이아웃 스킨 가운데 댓글 문제 해결 방안 정보

table을 쓰지 않는 레이아웃 스킨 가운데 댓글 문제 해결 방안

본문



안 되는 실력이다보니 정말 고민을 많이 했습니다.
그렇다고 table을 쓰자니 div 만으로 짜고자 하는 블럭에 table이 끼어있는 것은 싫고
UL 도 써보고 margin, padding에 픽셀값을 주어보기도 했지만

마지막에 찾은 결론은 
코멘트 입력 부분을 아래와 같이 div 스타일을 적용하였습니다.
왜 이렇게 했는지 아시는 분은 아실 겁니다.

댓글(comment)이 한 두개 달리는 경우는 textarea 를 감싸는 div 부분에 적용한 픽셀 값이 깨지지 않지만 한 10개 정도 붙는다고 했을 경우 블럭이 깨집니다.

그래서 아래와 같이 적용해 보았습니다.
기존 스킨과 다른 점은 우측에 있던 댓글입력 input 버튼을 바로 위 div 우측정렬로 올려 놓았습니다.

초보자분들이 div 로 작업하실 때 헤매지 마시라고 올려드렸습니다.

    <div style='float:left;width:auto;text-align:left;padding-top:10px;'>
        <span style="cursor: pointer;" onclick="textarea_decrease('wr_content', 5);"><img src="<?=$board_skin_path?>/img/co_btn_up.gif" align='absmiddle' /></span>
        <span style="cursor: pointer;" onclick="textarea_original('wr_content', 5);"><img src="<?=$board_skin_path?>/img/co_btn_init.gif" align='absmiddle' /></span>
        <span style="cursor: pointer;" onclick="textarea_increase('wr_content', 5);"><img src="<?=$board_skin_path?>/img/co_btn_down.gif" align='absmiddle' /></span>
        <? if ($is_guest) { ?>
            이름 <INPUT type=text maxLength=20 size=10 name="wr_name" itemname="이름" required class=ed>
            패스워드 <INPUT type=password maxLength=20 size=10 name="wr_password" itemname="패스워드" required class=ed>
            <img src="<?=$board_skin_path?>/img/kcaptcha_img.gif" id='kcaptcha_image' border='0' width=120 height=60 onclick="imageClick();" style="cursor:pointer;" title="글자가 잘안보이는 경우 클릭하시면 새로운 글자가 나옵니다.">
            <input title="왼쪽의 글자를 입력하세요." type="input" name="wr_key" size="10" itemname="자동등록방지" required class=ed align='absmiddle'>
        <? } ?>
        <input type=checkbox id="wr_secret" name="wr_secret" value="secret">비밀글
        <? if ($comment_min || $comment_max) { ?><span id=char_count>글자</span><?}?>
    </div>
 <div style='float:right;width:80px;padding-top:10px;'><input type="image" src="<?=$board_skin_path?>/img/co_btn_write.gif" border=0 accesskey='s' title='댓글 작성 후 클릭해 주세요.'></div>
 <div style='clear:both;'></div>
 <div>
  <textarea id="wr_content" name="wr_content" rows=5 itemname="내용" required
  <? if ($comment_min || $comment_max) { ?>onkeyup="check_byte('wr_content', 'char_count');"<?}?> style='position:relative;width:100%; word-break:break-all;' class=tx></textarea>
  <? if ($comment_min || $comment_max) { ?><script language="javascript"> check_byte('wr_content', 'char_count'); </script><?}?>
 </div>
추천
0

댓글 1개

전체 1 |RSS
그누4 팁자료실 내용 검색
  • 개별 목록 구성 번호 제목 작성자 작성일 추천 조회
  • 게시물이 없습니다.

회원로그인

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