Я создал следующую тестовую страницу, чтобы продемонстрировать проблему:
<html>
<head>
<style>
.panel {
position: absolute;
width: 326px;
max-height: 200px;
overflow: scroll;
z-index: 1000;
}
.item-container {
width: 100%;
list-style: none;
outline: 0;
padding: 0;
border: 0 none;
box-sizing: border-box;
cursor: pointer;
}
.item {
width: 100%;
}
.item.highlighted {
color: #fff;
background-color: #103e61;
}
</style>
</head>
<body>
<div class="panel">
<ul class="item-container">
<li class="item">Test1</li>
<li class="item">Test2</li>
<li class="item">Test3</li>
<li class="item">Test4</li>
<li class="item">Test5</li>
<li class="item">Test6</li>
<li class="item">Test7</li>
<li class="item">Test8</li>
<li class="item">Test9</li>
<li class="item">Test10</li>
<li class="item highlighted">Test11</li>
<li class="item">Test12</li>
<li class="item">Test13</li>
<li class="item">Test14</li>
<li class="item">Test15</li>
</ul>
</div>
</body>
</html>
Скрипка: https://jsfiddle.net/jfvtc1ek/
При открытии в Chrome 70.0.3538.77 элемент списка «Test11» отображается белым при прокрутке, поскольку Chrome по какой-то причине не отображает цвет фона. Это как-то связано с абсолютным позиционированием родителя в сочетании с z-индексом.
Та же скрипка работает в Firefox, поэтому я не уверен, что это ошибка в Chrome?