IE 7 블록 요소의 높이를 변경

Question

<div class="navi-buttons"> 
       <div class="box"> <a href="#" id="c1f" class="simple">1</a></div> 
       <div class="box"><a href="#" id="c2f" class="simple">2</a></div> 
       <div class="box"> <a href="#" id="c3f" class="simple">3</a></div> 
       <div class="box"> <a href="#" id="c4f" class="simple">4</a></div> 
       <div class="box"> <a href="#" id="c5f" class="simple">5</a></div> 
       <div class="box-hover"><a href="#" id="c6f" class="hover">6</a></div> 
      </div> 

.navi-buttons 
{ 
margin-top:8px; 
height:auto; 
} 

.navi-buttons .box{ background-color: #FF9900; display:block; padding:4px;margin-right:2px;float:left;width:10; height:13px;} 
.navi-buttons .box-hover{ border: thin solid #FF9900; display:block; padding:3px;margin-right:2px; float:left;width:10; height:13px;} 
.navi-buttons .hover 
{ 

padding: 3px; 
color: #FF9900; 

} 
.navi-buttons .simple 
{ 
background-color: #FF9900; 
padding: 3px; 
color: #FFFFFF; 
} 

.navi-buttons a:hover 
{ 

text-decoration: underline; 
} 

결과 :

유 IE 7이 케이스 (4)의 높이 변화의 선택된 버튼 아래 이미지는 다른 브라우저에서 잘 작동 보이면 마크 업과 CSS를 포함 시켰습니다. 아무도 도움을 줄 수 있습니까? 어디에서 잘못하고 있습니까?

Thnx

Answer 1

는 1px 대신 thin 작성해야 할 수 있습니다. 이와 같이 :

.navi-buttons .box-hover { 
    border: 1px solid #FF9900; 
    display:block; 
    padding:3px; 
    margin-right:2px; 
    float:left; 
    width:10; 
    height:13px; 
}