Internet ExplorerとOperaで背景色が表示されない

Question

このメニューは、OperaとInternet Explorerで背景が消え、エクスプローラとの互換性を向上させるためのヒントが素晴らしいことを除いて、うまくいきます。

また、あなたがそれに精通している場合は、基礎フレームワークからfoundation.cssを使用しています。

あなたがアクションでそれを見たい場合：http://www.pink-realty.com

.elephant-menu { 
     width: 100% !important; 
     height: 40px; 
     z-index: 50 !important; 
     opacity: 1; 
     background: url(../images/misc/button-gloss.png) repeat-x 0 -34px, -moz-linear- gradient(top, rgba(255,255,255,.4) 0%, transparent 100%) #e51d9b; 
     -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.52), inset 0 1px 0 rgba(255,255,255,.5); 
     -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.52), inset 0 1px 0 rgba(255,255,255,.5); 
     box-shadow: 0 1px 2px rgba(0, 0, 0, 0.52), inset 0 1px 0 rgba(255,255,255,.5); 
     text-shadow: 0 -1px 1px rgba(0,0,0,0.28); 
     background: url(../images/misc/button-gloss.png) repeat-x 0 -34px, -webkit- gradient(linear, left top, left bottom, from(rgba(255,255,255,.4)), to(transparent)) #e51d9b; 
     border: 1px solid rgba(229, 33, 155, 1); 
     -webkit-transition: background-color .15s ease-in-out; 
     -moz-transition: background-color .15s ease-in-out; 
     -o-transition: background-color .15s ease-in-out; 
     text-transform: capitalize; 
     font: 16px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif; 
     margin-left: 0; 
     margin-right: 0; 
     } 

    .elephant-menu li { 
    list-style-type: none !important; 
    text-transform: capitalize !important; 
    font-weight: bold; 
    color: white !important; 
    text-decoration: none !important; 
    float: left !important; 
    position: relative !important; 
    font-size: 16px; 
    padding: 11px 5px 10px; 
    display: block; 
    } 

    .elephant-menu li:hover { 
    color: white; 
    background-color: #9c126f; 
    -moz-box-shadow: inset 0 2px 5px black; 
    -webkit-box-shadow: inset 0 2px 5px black; 
    box-shadow: inset 0 2px 5px black; 
    -webkit-transition: all 0.3s ease-in-out; 
    -moz-transition: all 0.3s ease-in-out; 
    -o-transition: all 0.3s ease-in-out; 
    -ms-transition: all 0.3s ease-in-out; 
    transition: all 0.3s ease-in-out; 
    } 

    .elephant-menu a { 
    color: white; 
    text-decoration: none; 
    } 

Answer 1

このような何かを追加してみてください...あなたの色とアルファを変更します。

.elephant-menu { 
background-image: -o-linear-gradient(top, #FFFFFF 0px, #E5219B 70%); 
}