HTML5/CSS3 - IE11はchromeとfirefoxと違ってnavbar liを表示します

Question

私の会社のウェブサイトを再設計しました.2ページには以下の記事のアンカーを持つnavbarがあります。

私たちはFirefoxとChromeで動作しました。リストの表示や調整にはバグはありませんでした。しかし、実際には、IE11で表示がひどくなっていることがわかりました（Edgeでも同様ですが、動作も異なります）。

私はこれらのすべてのブラウザの間で妥協点を見つけようと努力しており、コードはどこでも使えるようになっています。ここで

が

ここでは表示されるようになっていますかIE11で台無し一部だ（Firefoxの/クロームで動作します）：

をまた、Firefoxとクロームで、私たちはアイコンでの視覚化このliは、IE11には現れません。

この問題を解決する方法をお手伝いしますか？

おかげ

** EDIT：**ここ

#menu-logiciel ul { 
    display: inline-table; 
    margin-bottom: 0; 
} 
#menu-logiciel { 
    text-align: center; 
} 
#menu-logiciel li a { 
    display: inline-block; 
    width: 180px; 
    text-decoration: none; 
    color: #005898; 
    font-weight: bold; 
    text-align: center; 
    margin: 5px; 
    font-size: 140%; 
    font-weight: bold; 
    height: 90px; 
} 
#menu-logiciel li { 
     display:inline; 
     } 

HTMLコードです：

<div id="menu-logiciel"> 

    <ul class="paragraphes-articles" style="padding-left: 0;"> 
    <li class="liens-rubriques"><a href="/index.php/it-engineering#anchorwipbox"><i class="uk-icon-chevron-down"></i> CONSULTING ET AUDIT</a></li> 
    <li class="liens-rubriques"><a href="/index.php/it-engineering#anchorcamille"><i class="uk-icon-chevron-down"></i> BUSINESS INTELLIGENCE</a></li> 
    <li class="liens-rubriques"><a href="/index.php/it-engineering#anchorcairm" id="tma"><i class="uk-icon-chevron-down"></i>TMA</a></li> 
    <li class="liens-rubriques"><a href="/index.php/it-engineering#anchortoolbox" style=" width: 185px;padding-left: 10px;"><i class="uk-icon-chevron-down"></i> INTEGRATION DE SERVICES</a></li> 

</ul> 
</div> 

Answer 1

私は見ることができましたここでこれらの表示のための主なCSSの一部ですエッジの問題も。あなたがChromeで見れば、あなたは計算された値が<i class="uk-icon-chevron-down"></i>ためdisplayで異なっていることがわかります：Chromeの場合

• ：IE /エッジでdisplay: block
• ：display: inline-block

はどれ興味があるのは、iの表示に影響するような唯一のスタイルは、それをinline-blockにしてブロックしていないように思われるので、私は見つけられませんが、別のスタイルがあるかもしれないと推測しています（-ms-*スタイリングホワイchは違いを説明することができましたが、もう一度それらを削除することで修正できませんでした）。

私が見つけたシンプルなソリューション、iはdisplay: blockを持たせるためにシェブロンがliの幅全体を占有し、ダウンかわり側でそれを持つのテキストをプッシュしますそのようでした：

.liens-rubriques > a > i.uk-icon-chevron-down { 
    display: block; 
}