I meticulously followed the instructions in a YouTube tutorial to implement this code. What's puzzling is that while the code works perfectly for the person in the video, allowing the grid items to scroll to the right, it doesn't have the same effect when I try to run it on my end.
If someone could take a look and help me figure out what may be causing this discrepancy, I would greatly appreciate it.
.wrapper {
max-height: 120px;
border: 1px solid #ddd;
display: flex;
overflow-x: auto;
}
.wrapper::-webkit-scrollbar {
width: 0px;
}
.wrapper .item {
min-width: 110px;
height: 110px;
line-height: 110px;
text-align: center;
background-color: #ddd;
margin-right: 2px;
}
<div class="wrapper">
<div class="item">box-1</div>
<div class="item">box-2</div>
<div class="item">box-3</div>
<div class="item">box-4</div>
<div class="item">box-5</div>
<div class="item">box-6</div>
</div>