IE9で少し問題があり、それを理解できません。線形グラデーションのCSSでボタンを作成しています。これは、Chorme、Firefox、Safariで完全に表示されますが、IE9では表示されません。
http://ubizzo.co.uk/img/ie9.png
http://ubizzo.co.uk/img/ch-fi-sa.png
最初の画像リンクはIE9、2番目の画像リンクは他のすべてのブラウザです。これを機能させる唯一の方法は、以下のようにcssにfloat:leftまたはfloat:rightを追加することですが、それは明らかにレイアウトを台無しにします。 float:noneを使用しようとしましたが、それも機能しません。競合するcssを除外するために、空白のhtmlファイルでこれを試しましたが、それでも機能しません:-s
.purchase {
margin-top: 5px;
display: block;
width: auto;
}
.purchase a {
margin-top: 10px;
margin-bottom: 10px;
padding: 5px 10px;
cursor: pointer;
border: none;
color: #fff;
line-height: 1em;
width: auto;
**float: left;**
border-image: initial;
text-align: center;
border: solid 1px #189199;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
background: -moz-linear-gradient(top, #19d7e3, #12A4B3);
background: -webkit-gradient(linear, left top, left bottom, from(#19d7e3), to(#12A4B3));
background: -moz-linear-gradient(top, #19d7e3, #12A4B3);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#19d7e3', endColorstr='#12A4B3');
}
.purchase a:hover {
background: -moz-linear-gradient(top, #12A4B3, #19d7e3);
background: -webkit-gradient(linear, left top, left bottom, from(#12A4B3), to(#19d7e3));
background: -moz-linear-gradient(top, #12A4B3, #19d7e3);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#12A4B3', endColorstr='#19d7e3');
color: #ffffff;
}
助けてくれてありがとう、アダム。
http://jsfiddle.net/gdmP8/-float:left / rightを追加した場合にのみ、ボタンが表示されることに注意してください