Chrome使用动态内容折叠内联元素的宽度

如果您在谷歌浏览器中打开以下网址，您会看到问题，首次载入时可以，但如果您不断刷新顶部3项的宽度（Bedingungen， Preise和所以geht的）崩溃。在Firefox中没关系，但我不知道它为什么在Chrome中做到这一点，任何人看到它为什么会发生或有解决方案？谢谢！Chrome使用动态内容折叠内联元素的宽度

文本使用Ajax/json加载，它们是内联的，因为我希望它们是文本的宽度。我不想设定一个固定的宽度。

http://alexanderlloyd.info/test/

CODE

CSS: 

#game-nav li a { 
    background: none repeat scroll 0 0 rgb(255, 255, 255); 
    border: 1px solid rgb(217, 195, 169); 
    color: rgb(34, 34, 34); 
    display: inline-block; 
    padding: 8px 12px 8px 8px; 
    text-decoration: none; 
    text-transform: uppercase; 
} 

    JavaScript: 

     $(document).ready(function() { 
     var data; 
     function loadContent(){ 
      $.ajax({ 
       url: "json/content.json", 
       data: "nocache=" + Math.random(), 
       type: "GET", 
       contentType: "application/json", 
       dataType: "json", 
       success: function(source){ 
        data = source; 
        showInfo(); 
       }, 
       error: function(data){ 
        alert("Failed to load content"); 
       } 
      }); 

     } 

     loadContent(); 
      function showInfo(){ 
       $(".text").html(data[lang]['startpage']['text']); 
     } 
     showInfo(); 
     });

来源

2013-03-27 user1937021