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

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

· 13년 전 · 6004 · 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>

게시글 목록

번호 제목
2718
2714
2713
2712
2711
2709
2708
2707
2706
2695
2692
2688
2683
2679
2678
2677
2676
2656
2588
2579
2578
2550
2539
2532
2511
2448
2437
2426
2417
2416