왜 IE에서 입력 어긋남은? 파이어 폭스와 크롬에서는 괜찮습니다

Question

왜 IE에서 입력이 어긋 났습니까? Firefox와 Chrome에서는 괜찮습니다. 이미지 아래에 입력이 나타나지 않습니다. 이후 이미지를 게시 할 수 없기 때문에 코드에 이미지 URL 대신 "xxx"를 넣고 코멘트에는 스크린 샷 URL을 넣을 것입니다. 덕분에 많은

<li class="img"> 
    <div class="pic"> 
     <img width="117px" height="70px" src="attachment/201202/21/1_1329785854VWAO.jpg.thumb.jpg"> 
     <div class="remove" style="display: none;"> 
     </div> 
    </div> 
    <input type="text" placeholder="say something" value="" class="txt"> 
</li> 

li.img { 
    background: none repeat scroll 0 0 #FFFFFF; 
    height: 102px; 
    overflow: visible; 
    padding: 0 4px; 
    position: relative; 
    width: 117px; 
} 
li { 
    float: left; 
    margin-left: 10px; 
} 
li { 
    list-style: none outside none; 
} 
.pic { 
    margin-bottom: 5px; 
    overflow: hidden; 
} 
.txt { 
    border: 1px solid #DEDEDE; 
    color: #999999; 
    float: left; 
    height: 20px; 
    line-height: 20px; 
    margin-left: 0; 
    padding-left: 6px; 
    width: 108px; 
} 

Answer 1

자체 사업부의 텍스트 입력 상자를 넣고 왼쪽으로 DIV 플로트 :

<li class="img"> 
    <div class="pic"> 
     <img width="117px" height="70px" src="attachment/201202/21/1_1329785854VWAO.jpg.thumb.jpg"> 
     <div class="remove" style="display: none;"> 
     </div> 
    </div> 
    <div class="txt"> 
     <input type="text" placeholder="say something" value="" class="txt" > 
    </div> 
</li> 

---

li.img { 
    background: none repeat scroll 0 0 #FFFFFF; 
    height: 102px; 
    overflow: visible; 
    padding: 0 4px; 
    position: relative; 
    width: 117px; 
} 
li { 
    float: left; 
    margin-left: 10px; 
} 
li { 
    list-style: none outside none; 
} 
.pic { 
    margin-bottom: 5px; 
    overflow: hidden; 
} 
div.txt { 
    float: left; 
} 
input.txt { 
    border: 1px solid #DEDEDE; 
    color: #999999;  
    height: 20px; 
    line-height: 20px; 
    margin-left: 0; 
    padding-left: 6px; 
    width: 108px; 
}