NAV-Links (transform problem)and translate from axes

Sometimes in the header links of a website when we hover over one link ,other links get translated or move from their axes and the transform property is not working on them when hovered

ul li a{
  --------//some basic styles for appearence
  -------
display:inline-block;//but considering the display property
}
ul li a:hover{
  font-size:30px; //only for reference 
}

Is there any solution to avoid such problem.

Can you give a like to a live example of this problem?