JSFiddle - React, Tailwind, and code Playground
HTML
<div class="board">
<div class="cards">
</div>
</div>
CSS
.card {
border: 1px solid black;
width: 100px;
height: 100px;
display:inline-block;
margin-left: 4px;
margin-right: 4px;
}
.cards {
position: relative;
top: 10px;
white-space:nowrap;
}
.board {
width: 400px;
height: 120px;
border: 1px solid red;
position: relative;
overflow: hidden;
}
JavaScript
$('.board').mousemove(function(e) {
$('.cards').css({left: e.pageX});
});
$('.board').click(function(e) {
$('.cards').append("<span class='card'></span>")
});