How to center align img wrapped in SPAN tag?

css, html

Solution

Just make image wrapper block level element and `text-align:center;` it.

FIDDLE

or wrap it in another element if needed;

FIDDLE

Problem

I am trying to center align an image that is wrapped in a `<span>`, but I am having trouble doing so. I have uploaded my CSS and HTML to jsfiddle: http://jsfiddle.net/7nHhu/1/ I am trying to get the image to center align itself with the content in a "block" style (ie. all text above and below it, not wrapped to the left or right) Any help would be greatly appreciated. ``` .imgframe { border: 1px solid #EAEAEA; display: inline-block; margin: 8px; } .imgframe img { border: 1px solid #FFFFFF; margin: 0; background: #F6F6F6; padding: 8px; -moz-box-shadow: 2px 2px 5px #CCCCCC; -webkit-box-shadow: 2px 2px 5px #CCCCCC; } <span class="imgframe centerimg"><img src="http://i48.tinypic.com/31368e9.jpg" /></span>​ ```

Original source