Webページの上部にcssdisplay:inline-block属性を使用してスタイル設定されたテキストがあります。この属性を使用したのは、必要なレイアウト目標を達成するためです。(実際のコードは以下よりも少し複雑で、ブロック要素によって正しく表示できます。)
ただし、下のページをカバーすることになっているドロップダウンメニューにjavascriptとcssを追加しました。透けて見える上記のインラインブロック要素を除いて、下のページをカバーしています。
誰もがこの要素をカバーする方法を提案できますか?
これが私が現在持っているコードです。
ヘッダーの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
<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>