새 댓글 작성

2010-05-14 05:07 PM

참고하시라고, 표준에 맞게 만들어봤습니다.
먼저 html은 이렇습니다.

<div id="legend">
    <ul>
        <li id="new">새로운 글</li><li id="general">일반 글</li><li id="sticky">고정된 글</li><li id="closed">잠긴 글</li><li id="moved">이동된 글</li>
    </ul>
</div>

아주 단순하죠.

아래는 CSS 정의입니다.

#legend {width:100%; border: 1px solid #999; margin:1em auto 0;}
#legend ul {width: 425px; margin: 5px auto; padding: 0;}
#legend ul li {list-style: none; display: inline-block; *display: inline; padding: 0 5px 0 20px; width: 60px; font-size: 12px; text-align: center;}
li#new {background: transparent url(new.png) no-repeat center left;}
li#general {background: transparent url(general.png) no-repeat center left;}
li#sticky {background: transparent url(sticky.png) no-repeat center left;}
li#closed {background: transparent url(closed.png) no-repeat center left;}
li#moved {background: transparent url(moved.png) no-repeat center left;}

주의하실 것은, li에 정의되어 있는 배경 그림의 이름을 실제 사용하신 것으로 바꾸셔야 합니다.
나머지 margin이나 padding 값은 layout에 맞게 조절해 주시면 될 듯하네요.

2010-05-13 11:31 PM

css에서 table에 적당한 margin-top 값을 주시면 될 것 같습니다.
그런데, 표준도 아니고 접근성도 떨어지는 table로 layout을 짜지 마시고 div으로 처리하시면 더 좋겠네요.

2010-05-13 01:05 AM

여기..요즘 잘 안열리던대..무슨일 잇으신가요?ㅠㅠ
질문좀 드릴께요.

어디다 질문드렸엇는대 답변이 안올라와서 다시올려요
링크 http://forum.standardmag.org/viewtopic.php?id=3298

질문 씀:

죄송들합니다 .. 전혀 주제와 다른 글들을 올리내요 정말 죄송합니다.
마땅하게 .. 도움을 요청할때가 없어서 질문드립니다 ^^;;
http://popotz.shworks.com/forum/index.php 여기 보시면 아시겠지만 맨 아래
새로운 글 일반 글 고정된 글 잠긴 글 이동된 글
이 기능을 추가하려 합니다.. main.tpl 수정하고 있는대 그냥 테이블식으로 만들어서 넣으면 첫 화면에는 이상없지만
포럼에 들어가게 되면 디자인이 망가지게 되더군요 .. css를 설정해줘야 하나..도움좀 주세요^^;;
버전은 1.3 최신버전입니다.

답변 씀:

디자인 깨지는것을 모르겠는데 정확히 어떤부분인가요?

질문

첫 이미지 입니다. 예 입니다.
main.tpl을 수정해 테이블을 만들어 추가를 했습니다.

<table border="1" cellspacing="0" width="860" bordercolordark="black" bordercolorlight="black" align="center">
<tr>
<td width="860" bgcolor="#FBFBFB"><p align="center">                                                     <IMG style="VERTICAL-ALIGN: middle"
alt="New posts" src="http://popotz.shworks.com/forum/img/XmasIani/icon_new.png" minmax_bound="true">  새로운 글   
<IMG style="VERTICAL-ALIGN: middle" alt="No new posts"
src="http://popotz.shworks.com/forum/img/XmasIani/icon.png" minmax_bound="true">  일반 글    <IMG
style="VERTICAL-ALIGN: middle" alt="Sticky thread" src="http://popotz.shworks.com/forum/img/XmasIani/sticky.png"
minmax_bound="true">  고정된 글    <IMG style="VERTICAL-ALIGN: middle"
alt="Closed thread" src="http://popotz.shworks.com/forum/img/XmasIani/closed.png" minmax_bound="true">  잠긴 글   
<IMG style="VERTICAL-ALIGN: middle" alt="Moved thread"
src="http://popotz.shworks.com/forum/img/XmasIani/redirect.png" minmax_bound="true">  이동된 글</p></td>
</tr>
</table>

css 를 따로 추가없이 테그로만 했습니다.

두번째 보시면 아시겠지만..테이블이 아래 테이블과 붙어버립니다.

1번 그림처럼 포럼을 선택해도 테이블 간격이 일정하게 할수없을까요?..
테이블이 붙지않고 간격유지할수 잇을까요..? 도와주세요 ㅠㅠ

새 댓글 작성

새 댓글 작성

새 댓글을 작성합니다.

글타래 내용 (최신 글 먼저)

3 miname께서 작성한 글 2010-05-14 05:07 PM

2 miname께서 작성한 글 2010-05-13 11:31 PM

1 asg88께서 작성한 글 2010-05-13 01:05 AM