CSS - How to center Absolute Position div with max width in IE9,10,11

Question

I need to center absolute position div that has max-width.

Here is an example. https://jsfiddle.net/allegrissimo123/3VHuK/1/

.mess{
    text-align: center;
    display: inline-block;
    margin: 0 auto;
    background: #212121;
    color: #FFFFFF;
    margin-bottom: 50px;    
    max-width: 350px;       
    position: absolute;
    top: 40px;
    left: 0px;
    right: 0px;
    z-index: 1000;
}

I test this in in IE9,10,11 but it does not work.

Answer 1

Assign width for the class.

.mess{
text-align: center;
display: inline-block;
margin: 0 auto;
background: #212121;
color: #FFFFFF;
margin-bottom: 50px;    
max-width: 350px;       
position: absolute;
top: 40px;
left: 0px;
right: 0px;
z-index: 1000;
width:100%; /* add this */
}

DEMO

Answer 2

This will put your div in the center(Vertically and Horizontally). You don't have to provide margin in this case. The below code can be applied to any div regardless of it's width. Make sure the parent div should have position:relative or absolute or fixed;.

    .mess{
     /*your other properties here*/
    position: absolute;
    top:50%;
    left:50%;
    -webkit-transform:translate(-50%,-50%);
    -ms-transform:translate(-50%,-50%);
    transform: translate(-50%, -50%);
    }