How to push element in the center of the container in CSS3?

There may be multiple ways but I will explain 4 here Let suppose parent container had a class name 'box' and child had a 'small-box' With Translate .box{ position: relative; width: 500px; height: 500px; ...