My purpose is to put inner div in the middle of container.
The example in fiddle:
The main problem is that inner div is shifted right in IE (Firefox and Chrome shows it fine) because of using css calc() rule. If I uncomment constant width in example above width: 156px, it works.
But it doesn't with calc(). Is there any way to fix it for IE?
P.S. as I know IE8 and lower doesn't support calc(), I was trying it in IE9.
Try this new fiddle, there where a couple of errors in your CSS. Here ya go:
http://jsfiddle.net/tuwd3tqg/1/
First off though, you where using position: absolute, and I don't know why. Second, you where using top and right, for those you must use position: relative. Third you where using right, which I changed to margin-right, and the items have to be float: right to use right.
EDIT
If you would like text aligned in the center add the following property to your wrapper text-align: center. Here is an updated fiddle: http://jsfiddle.net/tuwd3tqg/2/