有点'汗' - 我遇到了Z-index的第一个问题,它只影响FF并且在IE中工作正常。我有2个相互重叠的水平div,两者的宽度几乎都是100%。一个div左侧有一个侧栏,第二个div右侧有一个滚动条。两者都具有相同的Z-index,当我按下IE中的左栏时,它会激活链接,当我按下右侧的滚动条时,它可以正常工作。但在FF - 它不起作用。所以要么我必须在左div上设置更高的索引,然后我将不会访问右边或相反的方向。我需要使用两者而且事情是我无法真正改变div。有什么决议吗?我已经尝试过javascript Z-index移位但是工作不顺畅...谢谢。
#left_bar {
position: relative;
margin-top:-112px;
margin-left:auto;
margin-right:auto;
}
#post_table { // THE SCROLL on the right
position: relative;
margin-top:-800px;
margin-left:auto;
margin-right:auto;
padding-left:182px;
left:-12px;
}
#bar_links {
// THE LINKS on the left
position: relative;
margin-left:18px;
margin-right: auto;
padding-right:700px;
width: auto;
top:180px;
}
HTML:
<div align="center" id="left_bar" style="white-space:nowrap">
<img src="images/posting.png"/></div>
<div align="center" id="bar_links">
<a href="javascript:;" onmouseout="MM_swapImgRestore();"
onmouseover="MM_swapImage('images/slices/lipstick1','','images/slices/lipstick2.png',1);">
<img name="images/slices/lipstick1"src="images/slices/lipstick1.png"
width="132" height="56" border="0" id="lipstick" /></a>
</div>
<div align="center" id="post_table" style="height: 730px; width:644px; overflow: auto;overflow- x:hidden;">
<table width="640" id="table_main">
<tr>
<td>
<?php
echo "<table cellspacing='1' cellpadding='1' border='0' width='600' align='center'
id='inner_table'><tr><td>";
echo "<span style='font-size:11px;color:#dddddd;white-space:nowrap;background-
image: url(images/branches.png);float:left'> ".$post_date." </span> ";
echo "</td></tr><br/>";
echo "<tr><td align='left' id='post_style'>";
echo $posting;
echo "</tr></td>";
}; ?>
</td>
</tr>
</table>
</div>
答案 0 :(得分:1)
我可以肯定地说,您几乎肯定会遇到问题:您的HTML根本无效。
这一行在不同的浏览器中会做不同的事情:
echo "</td></tr><br/>";
其次,您说的是 z-index问题,但您提供的代码中有 none 。我们如何修复不存在的东西?
你的问题肯定是$posting;
没有显示在FF中,但它在IE中。原因很简单:您的#post_table
在 #left_bar
和#bar_links
之后定义为。这就是为什么它出现在下的原因。
我不知道您的想法是什么,但我可以确认您使用批次 负数余额将难以管理。现在你定义2个框并移动第三个上/下它们......
这是一个jsFiddle使用你的修正+修改后的代码,在FF和IE中看起来相似。