How to centre an element in CSS

In the olden days of HTML development, in the late 90ies, we only had inline styles. Centring an element was done using the <center> property. That approach isn’t very elegant anymore in modern CSS 🙂

Today we can use something like this:

#your-id .your-class {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

It’s slightly more complicated than a single tag, but also opens up more options to tweak top and bottom margins at the same time.

Jay is founder of WP Hosting, a boutique style managed WordPress hosting and support service. He has been working with Plesk since version 9 and is a qualified Parallels Automation Professional. In his spare time he likes to develop iOS apps and WordPress plugins, or drawing on tablet devices. He blogs about his coding journey at http://wpguru.co.uk and http://pinkstone.co.uk.

You can leave a comment on my original post.