我使用 Inkscape 在我正在开发的网站中创建了一个非常简单的图标。图标绝对位于两个并排元素的边界之上。
在 Chrome 中它看起来很棒：-
但在 IE7 中并非如此..:-
难道我做错了什么？据我所知，我的图像的彩色部分没有透明度。
这是我用来显示图像的代码：-
<div class="roadmapstep">
<div class="roadmapnumber">1</div>
<h4>Header 1</h4>
<div class="nextarrow"><img src="nextarrow.png"></div>
</div>
<div class="roadmapstep">
<div class="roadmapnumber">2</div>
<h4>Header 2</h4>
<div class="nextarrow"><img src="nextarrow.png"></div>
</div>
包含图像的 div 的 CSS 是：-
.nextarrow {
position: absolute;
top: 65px;
margin-right: -35px;
right: 0;
width: 65px;
height: 40px;
}
带边框的 div 的 CSS：
.roadmapstep {
width: 220px;
height: 150px;
border-left: 1px solid black;
border-top: 1px solid black;
border-bottom: 1px solid black;
float: left;
position: relative;
}