Jourdein

IE does support inline-block css styling but to which the elements are natively inline. Apply inline-block styling to strong, spans and ems.

But there’s another thing. If hasLayout is triggered on a block element, and then set that element to display inline, it will automagically become an inline-block in IE. However, you must do a *property hack to hide the display:inline from non-IE browser.

display: inline-block;
zoom: 1;
*display: inline;

Yet again, I faced this difficulty when centering text vertically. I’ve done this before but I’ve forgotten. Was hoping to find new way but landed on the same page I was referring before.

By Gavin Kistner, Understanding vertical-align, or “How (Not) To Vertically Center Content”

This is the code I used:
div.outer {height:100%;text-align:center;}
div.inner {position:absolute;top:40%;left:40%;height:36px;width:200px;}
<div class="outer">
<div class="inner">
<span class="title">Title</span>
<small>Caption</small>
</div>
</div>

I modified the code to fit my need. I wanted to center the content with the width of the viewing/browser width. I think, finding the correct percentage need trials. It depend on the width of the container. You could calculate though, mathematically.