[英]javascript/css cover inline-block
I have some text styled with the css display:inline-block attribute at the top of a webpage. 我在网页顶部用css display:inline-block属性设置了一些样式的文本。 I used this attribute because it accomplishes the layout goal I want.
我使用此属性是因为它完成了我想要的布局目标。 (The actual code is a bit more complicated than below and the block element enabled it to display properly.)
(实际代码比下面的代码复杂一些,而block元素使其能够正确显示。)
However, I have now added some javascript and css for a dropdown menu that is supposed to cover over the page underneath. 但是,我现在为下拉菜单添加了一些JavaScript和CSS,这些菜单应该覆盖了下面的页面。 It covers the page underneath except for the above inline-block element that shows through.
它覆盖了下面的页面,但上面显示的inline-block元素除外。
Can anyone suggest a way to cover over this element as well. 任何人都可以提出一种涵盖此元素的方法。
Here is code I have currently. 这是我目前拥有的代码。
javascript and css in header 标头中的javascript和CSS
<style type="text/css">
#results {display: block;
padding: 4px;
position:absolute;
text-align:left;
border-top-style:none;
background-color:white;
opacity:1.0;
filter:alpha(opacity=100);
}
.username {
position:relative;
display: inline-block;
}
</style>
function search() {
//retrieve input from webpage
document.getElementById("results").innerHTML=xmlhttp.responseText; //populate results div
//ajax to get resposetext from serve
}
html html
<table>
<tr>
<td>
<input type="text" onkeyup="searh(this.value)">
<div id="results" style="position:absolute"></div>
<div class="username">Username</div>
</td>
</tr>
</table>
尝试将下拉菜单的z-index
设置为较高的值,例如9999
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.