:hover在IE8上运行不正常

时间:2015-09-03 13:02:06

标签: html css internet-explorer-8

我的问题是我的:hover CSS代码。在IE8上我的链接悬停就在我将鼠标移到文本上但外部文本不起作用时。我真的不知道我的错误在哪里。需要一些帮助!

HTML: -

.ctaBlock {
  border: 1px solid #333;
  font: 400 10px/43px arial,helvetica,sans-serif;
  color: #333;
  letter-spacing: .1em;
  display: inline-block;
  text-align: center;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  text-transform: uppercase;
  line-height: 42px;
  width: 34%;
}
#content .ctaBlock:after {
 font-size: 7px;
 font-weight: 400;
 line-height: 1;
 font-family: iconFont;
 font-smoothing: antialiased;
 -webkit-font-smoothing: antialiased;
 -moz-osx-font-smoothing: greyscale;
 font-style: normal;
 font-variant: normal;
 letter-spacing: normal;
 text-decoration: none;
 text-transform: none;
 content: '>';
 display: inline;
 margin-left: 3px;
}
#content .ctaBlock:hover {
 background:rgb(255,255,255);
 background: transparent\9;
 background:rgba(255,255,255,0.3);
 filter:progid:DXImageTransform.
 Microsoft.gradient(startColorstr=#4cffffff,endColorstr=#4cffffff);
 zoom: 1;
 text-decoration: none;
 cursor: pointer;
}

CSS: -

total_vault_size =2.0T
used_vault_size =1.7T
available_vault_size =144G
used_percent =93%

2 个答案:

答案 0 :(得分:1)

IE8在处理元素的透明部分时遇到一些问题。我前一段时间遇到了同样的问题,我通过在CSS中添加透明图像(1px x1xx)作为背景来解决它:

!important

或使用数据网址:

background-image: url("transparent.png");

我认为更简单的解决方案可能是为您的链接添加非透明背景颜色。但这取决于您对透明背景的需求。我没有测试过第二种解决方案,但你可以尝试一下。

答案 1 :(得分:0)

opacity属性在IE8中不起作用。添加此背景:rgb(255,255,255);然后在最后分别添加不透明度:0.8。或者如果你使用哈希颜色代码会更好。