Andrew Kilburn Andrew Kilburn - 5 months ago 11
CSS Question

How to horizontally center a div with anchor links inside?

I've looked into this and follow a couple instructions and they don't seem to work.

Follow this link for the code:

https://jsfiddle.net/3h937r1q/7/

I've tried

margin: 0 auto;
(
center-block
class) and
float: none;
on the parent div but I can't seem to get it to work. Can anyone help me center div in the middle of the page and tell me why it isn't working?

Expected outcome: https://jsfiddle.net/3h937r1q/22/

Except I do not want to use
margin-left
to move it in to the middle

Answer

You can use col-offset:

        <div class="col-xs-12 col-md-12 home-buttons center-block" >
        <a href="#" class="col-xs-6 col-sm-4 col-md-2 HomepageBtn Animate col-sm-offset-2 col-md-offset-4" >
            <div class="tile-text">
                AP REVIEW
            </div>
        </a>
        <a href="#" class="col-xs-6 col-sm-4 col-md-2 HomepageBtn Animate">
            <div class="tile-text">
                VAT CHECKER
            </div>
        </a>
    </div>