CSS Tricks: How to make sure an image is always centered inside its div

Here is the code I use to keep an image always centered inside its containing div, regardless of browser width or resizing:

<img src="yourimage.jpg" style="margin:0px auto;">

You can also place the image in a div or span with the style “text-align:center;” and then add “display:inline-block;” to the image, like so:

<div style="text-align:center;">
<img src="yourimage.jpg" style="display:inline-block;">
</div>