我必须使用justify-content：center将块居中，使其位于其父div的中心。并且，如果内容超出了需要的宽度，我需要使用overflow-x：scroll，以便所有块都位于同一行。问题是，使用justify-content隐藏了一些起始块：
注意：如果块的数量限制为3或4或更小，我需要将所有内容放在中间。
请通过此链接
.nav-tabs {
overflow-x: scroll;
border: 0;
display: flex;
align-items: stretch;
flex-wrap: nowrap;
justify-content: center;
}
.nav-tabs .nav-item {
width: 20%;
min-width: 198px;
float: left;
display: flex;
align-items: stretch;
text-align: center;
margin-bottom: 0;
}<ul class="nav nav-tabs" role="tablist">
<li class="nav-item">
<a class="nav-link" href="#tab-1">
<span class="iconWrapper"><i class="fa fa-facebook"></i></span>
<span class="iconText">TAB 1</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#tab-2">
<span class="iconWrapper"><i class="fa fa-twitter"></i></span>
<span class="iconText">TAB 2</span>
</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#tab-3">
<span class="iconWrapper"><i class="fa fa-linkedin"></i></span>
<span class="iconText">TAB 3</span> …