I am working with a list that has a horizontal scrollbar, and I want to change the color of the list items. However, when I scroll, the styles on the items are not visible because the width of the items does not cover the full list width.
ul {
max-width: 250px;
overflow: scroll;
border: 1px solid red;
padding: 0;
margin: 0;
}
li {
white-space: nowrap;
list-style: none;
}
li:hover {
cursor: pointer;
background: #ccc;
}
<ul>
<li>sdjaflkjasd lfkjsadjf lksadjf ljadslfj lasdjfl jasf</li>
<li>asdf asdf dsaf</li>
<li>sdf dsaf dsa</li>
<li>sd afdsa fdsaf </li>
<li>sad fadsf sad</li>
</ul>