私はInkscapeを使用して、開発中のサイトに非常にシンプルなアイコンを作成しました。アイコンは、2つの並んだ要素の境界を越えて絶対的に配置されます。
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;
}