下拉菜单中的“破”在Firefox和IE

问题描述 投票:0回答:1

我有一个下拉这的工作在Chrome和Safari就好了菜单,但在Firefox和IE测试时,下拉框中较长下来,因此无法访问。

 <!--produkter dropdown -->                                                   
<div id="dropmenu1" class="dropmenudiv">
<a href="raw_frames.php">RAW Frames</a>
<a href="project321.php">PROJECT 321</a>
<a href="camsports.php">CAMSPORTS</a>
<a href="foss.php">FOSS</a>
</div>


<!--medie dropdown -->                                                
<div id="dropmenu2" class="dropmenudiv" style="width: 113px;">
<a href="testride.php?id=100">TEST RIDE</a>
<a href="howto.php">HOW TO</a>
<a href="riders_view.php">RIDERS VIEW</a>
</div>

.dropmenudiv{
    position: absolute;
    margin-top: 36px;
    border-bottom-left-radius: 5px 5px;
    border-bottom-right-radius: 5px 5px;
    border-left: 1px solid #333;
    border-right: 1px solid #333;
    border-bottom: 1px solid #333;
    font-size: 12px;
    font-weight: bold;
    line-height: 26px;
    z-index: 100;
    background: -moz-linear-gradient(top, #424141, #262626); /* Mozilla */
    background: -webkit-gradient(linear, left top, left bottom, from(#424141), to(#262626)); /* Chrome-Safari */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#424141', endColorstr='#262626'); /* IE */
    width: 137px;
    visibility: hidden;
}


    .dropmenudiv a{
        width: auto;
        display: block;
        text-indent: 5px;
        padding: 2px 0;
        text-decoration: none;
        color: black;
        padding-left: 5px;
    }

    * html .dropmenudiv a{ /*IE only hack*/
        width: 100%;
    }

    .dropmenudiv a:hover{
        background: -moz-linear-gradient(top, #545454, #2c2c2c); /* Mozilla */
        background: -webkit-gradient(linear, left top, left bottom, from(#545454), to(#2c2c2c)); /* Chrome-Safari */
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#545454', endColorstr='#2c2c2c'); /* IE */
    }

我看过周围的净很多,可以看出,其他很多人都与Firefox不显示在div相同的地方在Chrome和其他浏览器类似的问题。

css firefox google-chrome
1个回答
0
投票

该属性的位置是:绝对会导致此问题。试试这个代码,你已经使用,而不是什么。

http://jsfiddle.net/AAgfF/2/

© www.soinside.com 2019 - 2024. All rights reserved.