css질문입니다.  답변 꼭좀 부탁 드리겠습니다.

 

코딩을 하다가 반복되는 이미지가 있어서 클래스로 만들어서 쓸려고 합니다.

 

td에 스타일로 넣어서 코딩하면 제대로 중간 정렬이 먹는데 css로 빼놓으니까 중간정렬이 안먹네요.

 

몰잘못한건지? 이것저것 해봐도 안되서 이렇게 질문 올립니다.

 

[HTML 입니다]

 

<!--
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<link rel="stylesheet" type="text/css" href="finacial.css" />
</head>
<body leftmargin="0" topmargin="0">
<table cellpadding="0" cellspacing="0" border="0" width="750">
<tr>
 <td height="100"></td>
</tr>
<tr>
 <td width="100"></td>
 <td class="dot"></td>
 <td>LOGOLOGO</td>
</tr>
<tr>
 <td height="20"></td>
</tr> 
<tr>
 <td width="100"></td> 
 <td></td>
 <Td><img style="vertical-align:middle;padding-right:5px" src="acc_circle_dot.gif" border="0" width="5" height="5" /><font style="font-weight:bold">Branch Name</font></td>
<tr>
</table>
</body>
</html>
-->

 

[CSS 입니다]

 

@charset "utf-8";

*{font-family:sans-serif;font-size:12px}

body{margin:0; padding:0;}

.dot {
 vertical-align:middle;
 padding-right:5px;
 background:url(acc_circle_dot.gif) no-repeat;
 width:5px;
 height:5px;
}

 

답변 부탁 드리겠습니다.

 

결과물은 링크에 걸어 놓겠습니다.