탈

textarea 창 높이 늘리기

· 2014-04-13 (일) 00:43:19 · 13590 · 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'로 통합하는 것이 더 바람직하다고 생각됩니다.

첨부파일

2014.04.13_01.jpg (22.5 KB)
32회 2014-04-13 00:43
|

댓글 4개

2014-04-13 (일) 19:20:45
좋은 팁 감사합니다
감사합니다..^^
감사합니다!!!
2015-09-01 (화) 11:56:18
skin/board/basic/style.css

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

스킨마다 수정해줘야 하는 단점도...
댓글을 작성하시려면 로그인이 필요합니다.

그누보드5 팁자료실

2,788건
+
제목 글쓴이 날짜 조회
14-05-13 조회 2.9만
14-05-12 조회 1.2만
14-05-11 조회 1.3만
14-05-09 조회 1.3만
14-05-09 조회 1.8만
14-05-07 조회 9,433
14-05-07 조회 1.4만
14-05-03 조회 8,571
14-04-28 조회 1.1만
14-04-27 조회 7,226
14-04-27 조회 1만
14-04-19 조회 7,946
14-04-14 조회 7,590
14-04-13 조회 8,279
14-04-13 조회 1.4만
14-04-11 조회 1.7만
14-04-10 조회 8,242
14-04-09 조회 1.4만
14-03-29 조회 1.8만
14-03-28 조회 9,196
14-03-25 조회 1.1만
14-03-24 조회 1.9만
14-03-15 조회 1.1만
14-03-14 조회 1.1만
14-03-13 조회 1.2만
14-03-13 조회 9,006
14-03-12 조회 9,688
14-03-10 조회 8,916
14-03-05 조회 1.1만
14-03-01 조회 1.4만