Center bootstrap row

Question

I am using bootstrap list-group to display links to itunes, amazon and google play. Each link is its own list-group-item. I would like for all of these items to be centered inline with one another. How do I do this?

<!-- Download badges -->
<div class="container-fluid">
    <div class="row">
        <div class="list-group">
            <div class="col-xs-4 col-sm-4 col-med-4 col-lg-2">
                <a href="http://hyperurl.co/cplq6c" class="list-group-item" target="_blank">
                    <i class="fa fa-apple fa-2x" aria-hidden="true"></i>itunes</a>
            </div>

            <div class="col-xs-4 col-sm-4 col-med-4 col-lg-2">
                <a href="http://hyperurl.co/1qcfl6" class="list-group-item" target="_blank">
                    <i class="fa fa-amazon fa-2x" aria-hidden="true"></i>amazon</a>
            </div>

            <div class="col-xs-4 col-sm-4 col-med-4 col-lg-2">
                <a href="http://hyperurl.co/mb95g4" class="list-group-item" target="_blank">
                    <i class="fa fa-google fa-2x" aria-hidden="true"></i>google play</a>
            </div>
        </div>
    </div>
</div>

To be more clear, I would like to have the list-group centered on the page.

Answer 1

Change

<div class="container-fluid">

to

<div class="container">

Answer 2

Use the col-lg-offset-* classes. Demo. You need it on your first column.

<div class="col-xs-4 col-sm-4 col-med-4 col-lg-2 col-lg-offset-3">
 ...
</div>