CSS Overflow section is displayed with ellipses

The HTML is as follows:

<class= "box">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</ Div >

The CSS code is as follows:

. Box { width:50px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}

Online someone said compatibility IE7 need to add <meta http-equiv= "x-ua-compatible" content= "ie=7"/> This sentence, after I test not add also can,

The test results are as follows

Finally, there is a problem, is the ellipsis, Chrome, FF, 360 are biased on, ie kernel can be normal display, do not understand, if a friend knows, also hope to inform

CSS Overflow section is displayed with ellipses