I'm attempting to conceal internal nested elements inside a main container, in order for the container to scroll horizontally and reveal the hidden elements. You can view an example on this JSBin link.
.wrapper {
position: relative;
width: 150px;
height: 20px;
overflow-x: scroll;
overflow-y: hidden;
border: thin dotted;
}
span {
margin: 0 10px;
display: inline-block;
}<section class="wrapper">
<span>One</span>
<span>Two</span>
<span>Three</span>
<span>Four</span>
</section>