Thre are 2 ways to center and image, the old way and the new way. You can still use both.
Old Way
<p style="text-align: center;"><img src="/images/kb/2015/666/cat-whiskers-kitty-tabby-200x200.jpg" alt="cat whiskers kitty tabby 200x200" /></p>
- This is the method used from before time. You put style="text-align: center;" in the parent element which then centers the immediate child, in this case it is an image.
- text-align works on inline elements.
New Way
<p><img src="/images/kb/2015/666/cat-whiskers-kitty-tabby-200x200.jpg" alt="cat whiskers kitty tabby 200x200" style="display: block; margin-left: auto; margin-right: auto;" /></p>
- This method utilises style="margin: auto auto;" and works most of the time. You need to make sure the element you are centering has a set size, a block elemment. Also the centering in performed on the element itself in relation to its parent.
- margin: auto auto works on block level elements.