Centering an image (or any other element) has always been troubling in HTML, generally requiring off-by-one CSS hacks. A couple of years ago a new CSS layout style was introduced called "flex layout." This feature, which is now generally called "CSS Flex" or "CSS Flexbox", had spotty browser support at first, but has now matured to work on all major, current browsers (its implementation in IE 11 is spotty, but that isn't a "major, current browser"!). Flex offers a great way to center an element on a Web page. Flex has broad browser support and is ready to use for modern Web apps today.

Read the full technical article on