开发者

CSS3PIE Hover Problem

I'm not having much luck in the CSS3PIE forum getting some help for an issue that I'm having. (yep, PIE is active and working fine elsewhere on the page)

CSS3PIE Hover Problem

The failure is actually on two different elements:

1. The reply link's curved corners (top right & bottom left)

2. The comment container's border (all 4 corners)

CSS3PIE Hover Problem

Some of the code...

<p class="reply"><a href="#">+ reply to this comment</a></p>

.reply {
  margin: -1px 0 -1px -1px;
  padding: 0;
  font-size:开发者_如何学C 11px;
  line-height: 14px;
  color: #333;
}
.reply a:link {
  display: inline-block;
  padding: 3px 6px 3px 5px;
  -webkit-border-radius: 0 5px 0 5px;
  -moz-border-radius: 0 5px 0 5px;
  border-radius: 0 5px 0 5px;

  /* behavior: url(PIE.htc);  IE WON'T APPLY BEHAVIORS IN A HOVER SELECTOR? PLACING IT HERE ALSO GIVES Z-INDEX ISSUES */
}
.reply a:link, .reply a:visited  { color: #878787; }
.reply a:hover {
  padding: 2px 5px 2px 4px;
  color: #EEE;
  background-color: #666;
  border: 1px solid #666;
}

Thoughts?


In your reply CSS, you have:

  /* behavior: url(PIE.htc);  IE WON'T APPLY BEHAVIORS IN A HOVER SELECTOR? PLACING IT HERE ALSO GIVES Z-INDEX ISSUES */

Your PIE behavior is commented out. The following should fix it (assuming nothing else is interfering):

  behavior: url(PIE.htc);  /* IE WON'T APPLY BEHAVIORS IN A HOVER SELECTOR? PLACING IT HERE ALSO GIVES Z-INDEX ISSUES */


Try changing:

.reply a:link, .reply a:visited { color: #878787; }

with: .reply a:link, .reply a:visited { color: rgb(57, 57, 57) }

It seems IE + PIE have problems with # character


I've had similar problems and managed to get some effects working by applying "position:relative", for some strange reason this works sporadically. Another thing I've found is that IE8 seems to have a problem with building up the css locator when using PIE.htc within the style sheet i.e. ".class1 .class2 h2", instead I've managed to get some styles working by attributing a class directly to a tag i.e. h2 class="xxxx" and writing the class simply as .xxxx in the style sheet - hope this description makes sense and is of use

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜