css – Chrome加载力浮动：直到新行

我在Chrome中加载了一些问题,只有在某些时候它会一次性加载它,并且浮动在菜单中看起来很好,但其他时候它加载比平常慢,并导致浮点破坏到新行.我注意到它通常只发生在硬刷新(F5),但它有时会发生在刚刚点击.

这不是IE,Firefox或Safari中的问题.任何人有任何修改我的代码来解决这个问题？

这是我的代码：

HTML：

$text .=    '<div class="block-menu ">';
$text .=        '<a class="block-menu-item logo gray" href="/"></a>';
$text .=        '<a class="block-menu-item">Button 1</a>';
$text .=        '<a class="block-menu-item">Button 2</a>';
$text .=        '<a class="block-menu-item">Button 3</a>';

//Floats right
$text .=        '<div id="block-menu-bar-button">';
$text .=            '<a class="block-menu-item">Button 4</a>';
$text .=            '<a class="block-menu-item">Button 5</a>';
$text .=            '<div style="clear:both;"></div>';
$text .=        '</div>';
$text .=    '</div>';@H_450_9@ 
 
CSS：
 
  
 
#block-menu-bar-button{
     float:right; 
     display:inline-block; 
     overflow:hidden;
}
.block-menu{
     position:relative; 
     width:70%; 
     text-align:left; 
     margin:auto; 
     padding:15px 0;
}
a.block-menu-item,div.block-menu-item{
     display:inline-block; 
     margin:0 20px; 
     padding:2px 0;
     border-bottom: 2px solid transparent;
     cursor:pointer;
}@H_450_9@ 
 
我对浮动的替代物感兴趣：正确的(不是浮动的粉丝).我已经玩弄了使用table-cell的想法,但是我认为这是不好的做法.此外,我已经玩弄了flex-box的想法,但是在ie8或9中不支持,我的网站可以容纳这些浏览器.