I am having issue while using overflow-x: scroll and justify-content: center on flex parent container.Please see my code below.
issue: first flex child item is not showing it is crop in left or other all child item. please see my screenshot and code below.
I need your help. thank you in advance.
.container { width: 500px; margin: 0 auto; display: flex; justify-content: center; flex-direction: row; overflow-x: scroll;}.box { height: 100px; border: 1px solid red; min-width: 100px; margin-right: 10px; flex-grow: 1;}
<div class="container"><div class="box"></div><div class="box"></div><div class="box"></div><div class="box"></div><div class="box"></div><div class="box"></div></div>