IE 问题 z-index css
我完全困惑了。我已经阅读了针对该主题推荐的文章,但似乎仍然找不到有效的东西。
它应该是这样的: ------>使用 FIRFOX 或 SAFARI http://lisareisman.com/tests/focusTest
然后在 IE 8 或 9 上查看。 2 “i”图标和 iPod 标签已“重新定位”。
这是CSS:
#feature_top, feature_bottom {
z-index:1;
}
#feature_top img.info_btn {
position:relative;
float:right;
margin-top:-28px;
margin-right:165px;
z-index:2;
}
.img_overlay {
float:right;
margin-right:-15px;
margin-top: -150px;
position:relative;
z-index:3;
}
#feature_bottom img.info_btn {
position:relative;
float:right;
margin-top:-155px;
margin-right:125px;
z-index:2;
}
我有一个单独的ie样式表。
顶部部分的 html:
<div id="feature_top">
<img class="feature_arrow" src="img/arrow.png" alt="Feature arrow" />
<h2>QwickPay Mobile Payment System</h2>
<p class="top"><span class="bold">QwikPay</span> is a complete payment solution allowing your PC, Mac, IiPhone, iPod Touch, iPad or any other mobile smart phone, to evolve into a highly secure payment system. With <span class="bold">QwikPay</span>, you can easily accept credit and signature debit sales anytime, anyplace. Don't type, safely swipe and you and your customer will enjoy the convenience and peace of mind unmatched by any other secure, POS system. It is easy to use and can help merchants lower their cost of accepting cards by as much as 30%. When your customers want to pay with a card, <span class="bold">QwikPay</span> is the safest way.</p>
<div id="feature1_img">
<a href="#"><img src="img/qwikPaywithPhone.png" alt="" /></a>
<a class="iframe" href="http://www.qwickpay.com/"><img class="info_btn" src="img/info_icon.png" /></a>
<img class="img_overlay" src="img/made-for-iphone-ipod.png" />
<div style="display: none;">
<a class="fancybox" href="img/setUpSale.png"></a>
</div><!--end fancy box-->
</div><!--end feature image 1-->
</div><!--end of feature_top-->
我非常感谢您的帮助。我已经无计可施了。我正在使用资源管理器开发工具栏,我正在尝试推动“i”图标和“i”图标。 iPod 标签朝下,它们靠近,然后跳下来经过下图。
我不断回去尝试其他帖子中建议的内容,但似乎找不到合适的。真的很感激这段时间。祝你好运!!
谢谢你!!!
丽莎 “我应该知道怎么做,但我不知道”l;o)
I am utterly confused. I have read thru the articles recommended for this topic and still can't seem to find something that works.
Here's how it's SUPPOSED to look:
------> use FIRFOX or SAFARI
http://lisareisman.com/tests/focusTest
then look at it on IE 8 or 9. the 2 'i' icons and the iPod label have been 'relocated'.
this is the css:
#feature_top, feature_bottom {
z-index:1;
}
#feature_top img.info_btn {
position:relative;
float:right;
margin-top:-28px;
margin-right:165px;
z-index:2;
}
.img_overlay {
float:right;
margin-right:-15px;
margin-top: -150px;
position:relative;
z-index:3;
}
#feature_bottom img.info_btn {
position:relative;
float:right;
margin-top:-155px;
margin-right:125px;
z-index:2;
}
i have a separate ie style sheet.
html for the top section:
<div id="feature_top">
<img class="feature_arrow" src="img/arrow.png" alt="Feature arrow" />
<h2>QwickPay Mobile Payment System</h2>
<p class="top"><span class="bold">QwikPay</span> is a complete payment solution allowing your PC, Mac, IiPhone, iPod Touch, iPad or any other mobile smart phone, to evolve into a highly secure payment system. With <span class="bold">QwikPay</span>, you can easily accept credit and signature debit sales anytime, anyplace. Don't type, safely swipe and you and your customer will enjoy the convenience and peace of mind unmatched by any other secure, POS system. It is easy to use and can help merchants lower their cost of accepting cards by as much as 30%. When your customers want to pay with a card, <span class="bold">QwikPay</span> is the safest way.</p>
<div id="feature1_img">
<a href="#"><img src="img/qwikPaywithPhone.png" alt="" /></a>
<a class="iframe" href="http://www.qwickpay.com/"><img class="info_btn" src="img/info_icon.png" /></a>
<img class="img_overlay" src="img/made-for-iphone-ipod.png" />
<div style="display: none;">
<a class="fancybox" href="img/setUpSale.png"></a>
</div><!--end fancy box-->
</div><!--end feature image 1-->
</div><!--end of feature_top-->
I sure appreciate the help. I am close to wits end. I am using the Explorer Developer bar and I am trying to nudge the 'i' icons & the iPod label down and they get close then jump down past the image below.
I keep going back and trying things in other posts being suggested but can't seem to find the right one. Really appreciate the time. Have a good one!!
Thank you!!!
Lisa
'I should know how, but I don't' l;o)
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
您可以在 CSS 中使用 IE 条件注释来修复此问题。将它们放在当前 CSS 声明的末尾以防万一(优先级)...
You can fix this using IE conditional comments in your CSS. Put them at the end of your current CSS declarations just in case (precedence)...