Почему из-за transform: scale(1.1) немножко дергаются другие элементы сайта?

Здравствуйте, вопрос в заголовке. overflow прописаны и все равно. При наведении на картинку, например, линия в верхней части сайта, которая находится за пределами блока с продуктами, пропадает и снова появляется. Точно так же и футер, он немного приподнимается и опять опускается. Сабж.

/***
*
*	PRODUCTS STYLES
*
***/

.products {
	position: relative;
	display: block;
    list-style: none outside none;
    margin: 0;
    overflow: hidden;
    padding: 2px 0.5% 15px;
    background: #e9e9e9;
}

.products .item {
	position: relative;
	display: block;
	float: left;
	width: 32.2%;
    margin: 10px 0.5666% 0;
    -webkit-box-shadow: 0px 0px 5px 0px rgba(50, 50, 50, 0.99);
    -moz-box-shadow:    0px 0px 5px 0px rgba(50, 50, 50, 0.99);
    box-shadow:         0px 0px 5px 0px rgba(50, 50, 50, 0.99);
    overflow: hidden;
}

.products .item:hover > .img-block img {
    
}

.products .item .img-block {
    position: relative;
    display: block;
    width: 100%;
    height: auto;
    overflow: hidden;
    border-bottom: 3px solid #252729;
}

.item .img-block img {
    display: block;
    width: 100%;
    zoom: 1;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    -webkit-transition: all 200ms linear 0ms;
    -moz-transition: all 200ms linear 0ms;
    -ms-transition: all 200ms linear 0ms;
    -o-transition: all 200ms linear 0ms;
    transition: all 200ms linear 0ms;
}

.item .img-block img:hover {
    -webkit-transform: scale(1.1);
    -moz-transform: scale(1.1);
    -ms-transform: scale(1.1);
    -o-transform: scale(1.1);
    transform: scale(1.1);
}