CSS hover рисует изображение ниже

Question

У моего веб-сайта есть проблема. Когда я нахожусь на четвертом изображении, изображения ниже разваливаются, только на Mozilla, но отлично работают с Chrome. Я знаю его проблему с CSS, я пробовал -moz-border-radius, но не работает. Here is the link to the website вы могли бы попробовать, и вот часть CSS:

listsitemsbg { 
    list-style:none; 
    *zoom: 1; 
    margin:0; 
    width:100%; 
    padding-top: 10px; 
    padding-right: 0; 
    padding-bottom: 0; 
    padding-left: 0; 
} 
.listsitemsbg li { 
    margin-top:10px; 
} 
.listsitemsbg .thumbnail { 
    display: block; 
    padding: 4px; 
    border: 1.98px solid #BE2121; 
    background-color:#fff; 
} 
.listsitemsbg .thumbnail:hover { 
    border: 0px solid #aaa; 
    -moz-border-radius: 0px solid #aa 
} 
.listsitemsbg .thumbnail img { 
    width: 100%; 
} 
.listsitemsbg .thumbssettingsbg > div { 
    margin:0; 
    border-bottom: 0px dotted #ccc; 
    padding-top: 3px; 
    padding-right: 0; 
    padding-bottom: 3px; 
    padding-left: 0; 
} 

Answer 1

Проблема с границей в подвешенном состоянии. Обновите класс зависания, как показано ниже.

.listsitemsbg .thumbnail:hover { 
    border: 1.98px solid #fff; 
} 

Даже вы можете пойти с прозрачной рамкой, как показано ниже.

.listsitemsbg .thumbnail:hover { 
    border: 1.98px solid transparent; 
} 

Answer 2

Изменения состояния парения для миниатюры

.listsitemsbg .thumbnail:hover{ 
border: 1.98px solid #aaa; 
}