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

td간격??글자간격..해결좀요 ㅠㅠ

· 13년 전 · 6002 · 2
 

위에 상단메뉴를 텍스트로 만들려구하는데요..글자사이 간격을 줘야돼나요 td에 width를 줘야하나요..??
 
간격을 알수가없으니 답답하네요 제가 임의로 간격줘봤는데..잘안돼네요ㅜㅜ
 
<table border="0" cellpadding="0" cellspacing="0">
         <tr>
          <td width="50" style="font-size:12px; color=#8a8a8a;">로그인</td>
          <td width="50" style="font-size:12px; color=#8a8a8a;">회원가입</td>
          <td width="350"></td>
          <td width="50" style="font-size:12px; color=#8a8a8a;">주문조회</td>
          <td width="50" style="font-size:12px; color=#8a8a8a;">장바구니</td>
          <td width="50" style="font-size:12px; color=#8a8a8a;">배송문의</td>
          <td width="50" style="font-size:12px; color=#8a8a8a;">고객센타</td>
          <td width="50" style="font-size:12px; color=#8a8a8a;">공지사항</td>
          <td width="100" style="font-size:12px; color=#8a8a8a;">전화상담구매</td>
         </tr>
        </table>
 
width를 알면 좋을텐데 방법이 없어서..어떻게 방법을 없을까요?? 위에꺼와 똑같이 만들수있는..방법
 
한수부탁드립니다..

댓글 작성

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

로그인하기

댓글 2개

13년 전
table 에 width="100%" 를 추가하시고,
<td width="350"></td>
에서 width="350" 을 제거해보세요.

ul 로 간단하게 짜보자면

<style>
ul {margin:0;padding:0;width:100%;border-bottom:1px solid #ddd;background:#f7f7f7;list-style:none;zoom:0 !important;zoom:1}
ul:after {display:block;visibility:hidden;clear:both;height:0;content:""}
ul li {float:left;padding:5px}
ul li.fr {float:right}
ul li a {font-size:12px;color:#8a8a8}
</style>

<ul>
<li><a href=''>로그인</a></li>
<li><a href=''>회원가입</a></li>
<li class='fr'><a href=''>주문조회</a></li>
<li class='fr'><a href=''>장바구니</a></li>
<li class='fr'><a href=''>배송문의</a></li>
<li class='fr'><a href=''>고객센타</a></li>
<li class='fr'><a href=''>공지사항</a></li>
<li class='fr'><a href=''>전화상담구매</a></li>
</ul>

처럼 짤 수 있겠네요.
만약 주문조회부터가 순서가 꺼꾸로 나오면

<li class='fr'><a href=''>전화상담구매</a></li>
<li class='fr'><a href=''>공지사항</a></li>
<li class='fr'><a href=''>고객센타</a></li>
<li class='fr'><a href=''>배송문의</a></li>
<li class='fr'><a href=''>장바구니</a></li>
<li class='fr'><a href=''>주문조회</a></li>

처럼 순서를 바꾸시면 됩니다.
테이블 코딩을 해야만 한다면 이렇게도 해볼수 있을듯 하네요

<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td style="font-size:11px; color=#8a8a8a;text-align:left">
<a style="padding-right:10px" href="">로그인</a>
<a style="padding-right:10px" href="">회원가입</a>
</td>
<td style="font-size:11px; color=#8a8a8a;text-align:right">
<a style="padding-right:10px" href="">주문조회</a>
<a style="padding-right:10px" href="">장바구니</a>
<a style="padding-right:10px" href="">배송문의</a>
<a style="padding-right:10px" href="">고객센타</a>
<a style="padding-right:10px" href="">공지사항</a>
<a style="padding-right:10px" href="">전화상담구매</a>
</td>
</tr>
</table>

게시글 목록

번호 제목
2097
2095
2082
2071
2048
2046
2042
2022
2017
2001
1999
1996
1994
1989
1988
1982
1975
1971
1970
1964
1961
1958
1954
1951
1947
1944
1941
1938
1929
1926