Firefox 및 IE 드롭 다운 메뉴

Chrome 및 Safari에서 제대로 작동하는 드롭 다운 메뉴가 있지만 Firefox 및 IE에서 테스트 할 때 드롭 다운 상자가 더 길어서 연결할 수 없습니다.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 */ 
    }

나는 그물 주위에 많이 읽고 다른 많은 사람들이 파이어 폭스 크롬과 다른 브라우저에서와 DIV 같은 장소 표시되지 유사한 문제가있는 것을 볼 수 있습니다.

이 제발 도와주세요,이 시급하다 :

출처

2011-12-20 NizeGuy

파이어 폭스의 경우에도 메뉴 상단이 약간 아래입니다. .dropmenudiv 클래스에서 36px의 위쪽에는 원치 않는 마진이 있습니다. 이것을 제거하면 하위 메뉴가 메뉴에 더 가깝게 나타나고 하위 메뉴 위로 마우스를 이동할 수있었습니다. – rajkamal

.dropmenudiv에서 margin-top을 쉽게 제거하여 Firefox에서 작동하게 할 수는 있지만 Chrome에서는 작동하지 않습니다. – NizeGuy

속성 위치 : 절대 원인이 문제. 대신이 코드를 사용해보십시오.

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

출처

2011-12-20 06:44:40 designersvsoft

제공된 링크에서 코드를 시험해 볼 때 드롭 다운 효과가 표시되지 않습니다. – NizeGuy

이 메뉴는이 사이트에서 잘 작동하는 것을 볼 수 있습니다 .http : //campora.org/. 필요한 js는 bizj_menu.js뿐입니다. 이 시도. – designersvsoft

Firefox 및 IE 드롭 다운 메뉴

답변

관련 문제