2

So I can get IE8 to use :after quite easily:

<!DOCTYPE html>
<html>
<style type="text/css">
a.styled:after
{
content:" HAHA! Business.";
color:red;
font-size:12pt;
}
</style>
<body>
Here's some text and stuff. <a href="google.com" class="styled">Here's a link.</a>
</body>
</html>

If I put that in a text document and open it in IE, it displays what it should: "Here's a link" is followed by "HAHA! Business," in red. When I try putting the exact same code into a SharePoint Content Editor web part, it works on every browser I've tried EXCEPT for Internet Explorer. With IE, nothing is displayed after the link when I use :after, but any other sort of styling works fine. What gives?

Llama Fragments
  • 21
  • 2

1 Answers1

2

IE does not support :after prior to IE 8, and even with IE 8 it does not work without a doctype. You can check out this chart of css selectors and their support for more information as well.

Since you mentioned using IE8, I cannot find any reason why it should not work. There could possibly be some other content in your sharepoint web part that could be causing issues.

You may also be interested in how-do-you-work-around-ie-not-supporting-after or why-is-sharepoint-dispalying-my-html-and-css-content-improperly, two similar questions found here on stackoverflow.

Community
  • 1
  • 1
Josh Mein
  • 28,107
  • 15
  • 76
  • 87
  • Thanks for the link. I may end up using some sort of JavaScript solution. But like you said, it seems like it should work, so it must be some SharePoint weirdness. – Llama Fragments Jul 24 '12 at 18:55
  • The comments to [why-is-sharepoint-dispalying-my-html-and-css-content-improperly](http://stackoverflow.com/questions/4261451/why-is-sharepoint-dispalying-my-html-and-css-content-improperly) seem to point out similar issues that people have had with sharepoints web parts. – Josh Mein Jul 24 '12 at 18:56