CSS replacement for

Question

I know this question has been asked many times, but I never saw a satisfactory answer. I mean, an answer that actually works.

So, here we go again. Take this jsFiddl

Answer 1

    margin: 0 auto; 
    text-align: center;

Above Code might not be working when you are using bootstrap grids. Here is the quick solution for this using bootstrap 4 and IT WORKS IN EVERY BROWSERS

  

     

         
 your text goes here 
     
  

you can put any column like col-sm-2, 3, 4.......12

Replacement for Center tag in different situations

1. text-center Works with p, a, button, h tags and more i.e all the tags containing data or text directly

2. Flex It can used to align complete element inside another element, however it has more utilities check documentation for reference

Use can center elements using flex in following manners

display:flex;
justify-content:center;
align-items:center;

Another import property is flex-direction i.e

flex-direction:column
flex-direction:row

Use flex direction according to the type of alignment you want

3. mx-auto (bootstrap class)