How to display unlimited items horizontally?

I have a list of items in one of my view. I can only fit up to 6 items, and it's laid out like this:

I used class="col-md-2" for each one.

When I have more than 6, it just simply go down to the another row. I don’t want that. You can see it here.

Now, if the list has 6 or more items,

• list them horizontally
• show the big > so that the users will know that there is more
• show the 2 dots in the middle

Edit This is what I got so far. I used Larval 4 so this syntax is in HTML/Blade.

@foreach ( MarketingMaterialCategory::all() as $mmc )

    <h2><i class="fa fa-file-image-o color lighter"></i>&nbsp; {{{ $mmc->name or '' }}} &nbsp;<small> </small></h2>

    <div class="row">

    @foreach ( MarketingMaterial::where('marketing_materials_category_id','=', $mmc->id )->get() as $marketing_material)

    <div class="col-md-2" >
        <!-- Shopping items -->
        <div class="shopping-item">
            <!-- Image -->
            <div class="col-sm-12 imgbox" >
                <!-- <span class="col-sm-6"></span> -->
                <a href="#"><img class="col-sm-12 pull-right" width="200" src="/marketing_materials/{{$marketing_material->id}}/download/thumb_path" alt="" /></a>
            </div>

            <!-- Shopping item name / Heading -->
            <h6><a href="#">{{{ $marketing_material->title or '' }}}</a><span class="color pull-right">{{ FileHelper::formatBytes($marketing_material->media_size,0) }}</span></h6>

            <!-- Shopping item hover block & link -->
            <div class="item-hover bg-color hidden-xs">
                <a href="#">Download</a>
            </div>
        </div>
    </div>

    @endforeach

    </div>
    <hr>

@endforeach

Can someone help me how to resolve this ?