이상한 호버 버그

Question

이미지가있는 반응 형 모달 박스가 있습니다. 당신은 이미지를 가져

Code: 

그것에서

http://jsfiddle.net/YCcNY/34/

은 더 큰된다. 가끔 첫 번째 행의 마지막 사진 위로 마우스를 가져 가면 형식이 깨집니다. 그렇지 않은 경우 창 크기를 조정하십시오.

누구든지 해결 방법을 알고 있습니까?

Answer 1

졸탄의 대답은 매우 좋다. 또한 CSS 변환을 사용하여 크기를 조정할 수도 있습니다. 이미지는 약간 흐리게 보이지만 변환은 이미지의 실제 크기에 영향을 미치지 않으며 렌더되는 방식입니다.

li:hover img { 
    -moz-transform: scale(1.1); 
} 

Answer 2

높이가없는 부유 요소의 일반적인 동작입니다. 그것은 당신의 li 항목에 고정 된 높이를주고 해결하려면 - DEMO

.PhotoContent li { 
    width: 20%; 
    height: 100px; /* THIS */ 
    float: left; 
    font-weight: 200; 
    clear:none; 
    color: rgb(150,150,150); 
    cursor: pointer; 
    outline: 0px solid green; 
}