[css-d] rendering of icon in Windows browsers

[Sara Haradhvala]

I set up this unicode in CSS

.menu li::after {
        content: “◆”;
        font-family: athelas, serif;
        font-weight:bold;
        font-size: 16px;
}

My problem is that the diamond is much bigger in IE and somewhat bigger in FF 
on Windows. All looks good on Mac browsers and Chrome on Windows. IE seems to 
generate a full-height diamond (which looks overwhelming), while other browsers 
have space around the icon and it’s much smaller (and looks better). Any way 
around this? Would you use an svg instead?

Thanks.
______________________________________________________________________
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/