테스트 사이트 - 개발 중인 베타 버전입니다

textarea 창 높이 늘리기

· 11년 전 · 11516 · 4
2014.04.13_01.jpg
{이미지:0}

DHTML 에디터를 사용하지 않는 게시판의 경우는 글쓰기로 들어가 보면 기본 textarea 창이 보입니다.
그런데 이 창이 작아서 좀 빈약해 보입니다.

'css/default.css'의 '폼 테이블' 항목에서

[code]/* 폼 테이블 */
.tbl_frm01 {margin:0 0 20px}
.tbl_frm01 table {width:100%;border-collapse:collapse;border-spacing:0}
.tbl_frm01 th {width:70px;padding:7px 13px;border:1px solid #e9e9e9;border-left:0;background:#f5f8f9;text-align:left}
.tbl_frm01 td {padding:7px 10px;border-top:1px solid #e9e9e9;border-bottom:1px solid #e9e9e9;background:transparent}
.tbl_frm01 textarea, .frm_input {border:1px solid #e4eaec;background:#f7f7f7;color:#000;vertical-align:middle;line-height:2em}
.tbl_frm01 textarea {padding:2px 2px 3px}
.frm_input {height:22px}
.tbl_frm01 textarea {width:98%;height:300px}
.tbl_frm01 a {text-decoration:none}
.tbl_frm01 .frm_file {display:block;margin-bottom:5px}
.tbl_frm01 .frm_info {display:block;padding:0 0 5px;line-height:1.4em}[/code]

위 예시와 같이

.tbl_frm01 textarea {width:98%;height:100px}



.tbl_frm01 textarea {width:98%;height:300px}

처럼 height 값을 원하는 높이로 바꿔주면 됩니다.



그런데... 이렇게 수정하면... '댓글' 입력창도 동일하게 넓어집니다.
같은 폼을 사용하기 때문입니다.

폼 테이블 소스를 복사해서 아래에 붙혀넣고
이렇게 수정합니다.

[code].tbl_frm02 {margin:0 0 20px}
.tbl_frm02 table {width:100%;border-collapse:collapse;border-spacing:0}
.tbl_frm02 th {width:70px;padding:7px 13px;border:1px solid #e9e9e9;border-left:0;background:#f5f8f9;text-align:left}
.tbl_frm02 td {padding:7px 10px;border-top:1px solid #e9e9e9;border-bottom:1px solid #e9e9e9;background:transparent}
.tbl_frm02 textarea, .frm_input {border:1px solid #e4eaec;background:#f7f7f7;color:#000;vertical-align:middle;line-height:2em}
.tbl_frm02 textarea {padding:2px 2px 3px}
.frm_input {height:22px}
.tbl_frm02 textarea {width:98%;height:100px}
.tbl_frm02 a {text-decoration:none}
.tbl_frm02 .frm_file {display:block;margin-bottom:5px}
.tbl_frm02 .frm_info {display:block;padding:0 0 5px;line-height:1.4em}[/code]
'frm02'
'height:100px'

그리고...
'skin/board/basic/view_comment.skin.php' 파일에서

[code] <div class="tbl_frm01 tbl_wrap">[/code]를 찾아서

[code] <div class="tbl_frm02 tbl_wrap">[/code]로 수정해주면 됩니다.

갤러리 게시판에도 적용하려면...
'skin/board/gallery/view_comment.skin.php'도 동일하게 수정해줘야 겠지요.


'skin/board/basic/view_comment.skin.php' 파일에 직접 height 값을 입력해 주는 방법도 있겠지만...
'css/default.css'로 통합하는 것이 더 바람직하다고 생각됩니다.

댓글 작성

댓글을 작성하시려면 로그인이 필요합니다.

로그인하기

댓글 4개

11년 전
좋은 팁 감사합니다
감사합니다..^^
감사합니다!!!
skin/board/basic/style.css

[code]#bo_w .tbl_frm01 textarea {}[/code]에
[code]#bo_w .tbl_frm01 textarea {height:200px}[/code]높이값을 입력해주는 더 간편한 방법도 있네요.

스킨마다 수정해줘야 하는 단점도...

게시글 목록

번호 제목
1745
1738
1734
1733
1731
1730
1726
1707
1706
1705
1698
1692
1686
1684
1681
1679
1676
1665
1663
1660
1659
1651
1646
1642
1640
1636
1623
1602
1596
1593