웹마스터 팁
page_full_width" class="col-xs-12" |cond="$__Context->page_full_width">
테이블 정렬. 상하로 딱 가운데에 맞춰지지 않을때...
2002.05.18 22:13
현재의 NZEO 3차 스킨에서도 그렇지만 라인이 위아래에 있을때 상하 균형이 맞지 않는 경우가 허다합니다.
이건 정교한 웹디를 추구하시는 분들한테도 골치거리일텐데요.
블럭을 잡아보시면 블럭 위쪽으로 치우쳐 있음을 알수있습니다.
즉 (입력된 글꼴+아래쪽 여백) 이 결과는 바로 위쪽으로 치우치는 글입니다.
제 나름대로는 이렇게 해결합니다.(단, 세로 간격은 23px란 가정하에, line-height:150%;가 적용된 상태에서 작성합니다)
1. (변수는 단지 수치를 대신할 뿐입니다.)
<table width=<?=$width?> border=0 cellspacing=0 cellpadding=0>
<tr><td height=23 style=padding-top:3px;>그리고 글을 입력해 보세요.</td></tr></table>
위쪽으로 치우치기 때문에 패딩을 줘서 아래로 내렸습니다.
2. (NZEO 2차스킨에서 사용하던 방법)
<table width=<?=$width?> border=0 cellspacing=0 cellpadding=0>
<tr><td height=23><img src=t.gif width=1 height=3 align=absmiddle><br>그리고 글을 입력해 보세요.</td></tr></table>
존재하지 않는 이미지를 이용한 방법입니다.(화면상에는 보이지 않습니다)
블럭을 잡아보시면 위쪽에 자그마한 점이 같이 잡히는데 이 점이 존재하지 않는 이미지입니다.
align=absmiddle을 넣지 않으면 예상치 못한 결과를 초래합니다.
3.
<table width=<?=$width?> border=0 cellspacing=0 cellpadding=0>
<tr><td height=23>그리고 글을 입력해 보세요. <img src=t.gif width=1 height=13></td></tr></table>
이미지를 이용했습니다만 방법이 다르죠.
이번에는 위와 반대로 align=absmiddle을 뺐습니다.
이건 정교한 웹디를 추구하시는 분들한테도 골치거리일텐데요.
블럭을 잡아보시면 블럭 위쪽으로 치우쳐 있음을 알수있습니다.
즉 (입력된 글꼴+아래쪽 여백) 이 결과는 바로 위쪽으로 치우치는 글입니다.
제 나름대로는 이렇게 해결합니다.(단, 세로 간격은 23px란 가정하에, line-height:150%;가 적용된 상태에서 작성합니다)
1. (변수는 단지 수치를 대신할 뿐입니다.)
<table width=<?=$width?> border=0 cellspacing=0 cellpadding=0>
<tr><td height=23 style=padding-top:3px;>그리고 글을 입력해 보세요.</td></tr></table>
위쪽으로 치우치기 때문에 패딩을 줘서 아래로 내렸습니다.
2. (NZEO 2차스킨에서 사용하던 방법)
<table width=<?=$width?> border=0 cellspacing=0 cellpadding=0>
<tr><td height=23><img src=t.gif width=1 height=3 align=absmiddle><br>그리고 글을 입력해 보세요.</td></tr></table>
존재하지 않는 이미지를 이용한 방법입니다.(화면상에는 보이지 않습니다)
블럭을 잡아보시면 위쪽에 자그마한 점이 같이 잡히는데 이 점이 존재하지 않는 이미지입니다.
align=absmiddle을 넣지 않으면 예상치 못한 결과를 초래합니다.
3.
<table width=<?=$width?> border=0 cellspacing=0 cellpadding=0>
<tr><td height=23>그리고 글을 입력해 보세요. <img src=t.gif width=1 height=13></td></tr></table>
이미지를 이용했습니다만 방법이 다르죠.
이번에는 위와 반대로 align=absmiddle을 뺐습니다.
댓글 2
-
umin
2002.05.21 02:58
무식해서 그런지 잘 못알아 먹겠다는 -_-;;; -
icolor
2002.10.01 15:33
감사합니다..그동안 테이블 상하간격이 맞질않아성..어케할까 많이 고민했던 부분입니다~~고마워요