html - Line-height do not work on mobile -

I have an icon font and I need to center my letter in a circle. I copy my code / it The CSS code is

  .inon: before {margin: 0 auto; Font-size: 57px; } .con H2 {text-align: center; } .circle.icon: before {border-radius: 50%; Color: #FFFFFF; Width: 65px; Height: 65px; Display area; Text align: center; Line-height: 1.2 meters! Important; }. Cyon.mobile: First {content: 'F'; } .mobileC {color: # 8CC63E; }. Cyon.mobile-background: {background-color: # 8CC63E; }  

This is the html code

As you can see through the normal browser, they are centered

But when I open the page via mobile let me see this

Did you

  vertical-align: center;  

?

In most cases, it works

or you can use padding, and you can avoid resizing using it:

  Div {-webkit-box-sizing: border-box; -MOZ Box-Size: border-box; Box-size: border-box; }