-transform: масштабирование, вызывающее «мигание» при наведении курсора

Я работаю над каталогом, который использует атрибут css -transform для масштабирования каждого «образца» при наведении курсора.

Вот моя проблема: в некоторых браузерах и на определенных сайтах, когда вы наводите курсор на образцы, это заставляет страницу «мигать» при наведении курсора на них. Я тоже не могу решить проблему, на одном сайте она может быть уникальной для Safari, на другом это может происходить только в Chrome, на другом все в порядке.

Хотелось бы получить больше информации, но, возможно, кто-то еще столкнулся с аналогичная проблема.

.swatch {
  -webkit-box-shadow: #EFEFEF 2px 2px 0px;
  -webkit-transform: scale(1);
  -webkit-transition-duration: 0.2s;
  border: 1px solid white;
  position: relative;
  z-index: 1;

.swatch:hover {
  position:relative;
  z-index:10;
  transition-duration: 0.2s;
  transform:scale(1.8);
  -webkit-transition-duration: 0.2s;
  -webkit-transform:scale(1.8);
}

Также кажется, что проблема устранена при удалении каких-либо атрибутов z-index, но тогда образец при наведении находится позади других образцов; который не работает для этого проекта.

Любые мысли приветствуются.