How to center text horizontally & vertically within dotted border
===


I need to center some text between a dotted border vertically and horizontally as in below image : 

![enter image description here][1]


  [1]: http://i.stack.imgur.com/tGgsw.png

I have very simply fiddle which attepts to achieve this : http://jsfiddle.net/eCUv9/2/

How can the css be amended to appear as attached screenshot ?