jquery - 添加第二个菜单时无法单击菜单上的元素

Question

首先大家好。我的标题的第一个版本就是那个。

我的问题是，如果我添加第二个菜单(右菜单)，我的第一个菜单(左菜单)将失去点击属性。我检查了，但看不出问题所在。感谢您的帮助 :)。

          <div id="navbar">                

            <div id="menu1">
                <ul>
                    <li> <a href="kisiselilan.html"> Kisisel İlan Ver </a> </li>
                    <li> <a href="firmakaydet.html"> Firma Kaydet </a> </li>
                </ul>
            </div>

            <div id="logo">
                <a href="anasayfa.html"><img src="resimler/3.png" /></a>
            </div>

            <div id="menu2">
                <ul>
                    <li> <a href="kurumsalilanver.html"> Kurumsal İlan Ver </a> </li>
                    <li> <a href="iletisim.html"> İletisim </a> </li>        
                </ul>
            </div>

            <div id="navbar-cizgi">

              </div>

CSS

div#navbar{background:url(file:///C|/Users/Arda/Desktop/201.png) repeat;width:100%;height:157px;border-bottom:4px solid #900;}

/* LOGO */

div#logo img{position:absolute; width:200px;margin-top:-20px;margin-left:35%;}

/* MENU1 */

div#menu1{position:absolute;}
div#menu1 ul{margin-left:20%;margin-top:80px;}
div#menu1 ul li {display:inline;padding:50px;}
div#menu1 ul li a{font-weight:bold;text-decoration:none;color:#333;font-size:18px;border-bottom:2px dotted #900;}

/* MENU2 */

div#menu2{position:absolute;}
div#menu2 ul{margin-left:1000px;margin-top:80px;}
div#menu2 ul li {display:inline;padding:50px;}
div#menu2 ul li a{font-weight:bolder;text-decoration:none;color:#333;font-size:18px;border-bottom:2px dotted #900;}

Answer 1

那是因为绝对元素是一个在另一个之上。试试

display: inline-block;

工作 fiddle :https://jsfiddle.net/21aa87ua/