Icons clipped in chrome

316 views
Skip to first unread message

David Rocks

unread,
May 4, 2013, 9:24:19 PM5/4/13
to ico...@googlegroups.com

I built a font from the ultimate set. It is used with some buttons. Everything looks fine except for chrome(v.26). Several of the larger icons were clipped on output. As is shown below, the head of the arrow is clipped(whatever direction the arrow is pointing). This only showed on large icons(by this I mean icons that appear visually larger than others). For example, the 'flip' icon also got clipped.I did some research and found several references to this problem but they supposedly have been fixed in 2012. I got around it by choosing images with a visually smaller image.


Keyamoon

unread,
May 5, 2013, 2:07:32 AM5/5/13
to ico...@googlegroups.com
Do you have a link or a reduced test case I can take a look at?

David Rocks

unread,
May 6, 2013, 8:30:49 AM5/6/13
to ico...@googlegroups.com
I've been trying. The output is from Drupal and there is a lot of code that is dynamically generated. It has been hard to cut it all down. I'm going to see if I can reproduce by working from success to failure.

David Rocks

unread,
May 6, 2013, 10:17:50 AM5/6/13
to ico...@googlegroups.com
I should have just started simple. Forgetting all the drupal stuff and only on chrome v26, adding an icon to an anchor with css results in clipped icons, but only for some icons. In the subset I looked at the 'flip' characters and the 'arrow' characters made up of a solid arrow plus dashed lines were clipped. I have about 65 icons in my font but random sampling turned up only these 2.

ps. I actually noticed this earlier with previous font downloads but didn't look at it until I solved other problems. So I don't think I just got a bad download.

Keyamoon

unread,
May 6, 2013, 10:37:36 AM5/6/13
to ico...@googlegroups.com
If you can guide me on how to reproduce this problem myself, I'd be able to help. At least send me your SVG font. You can email it to me. Are you sure that the font-size you have set is not too large for its container? Maybe it's just a CSS problem.

David Rocks

unread,
May 6, 2013, 2:42:31 PM5/6/13
to ico...@googlegroups.com
I'll send you the font. It only gets clipped on chrome and I have tried all kinds of variations to see if I can change the behavior.

carrie...@space150.com

unread,
Aug 28, 2013, 11:17:37 AM8/28/13
to ico...@googlegroups.com
Were you able to resolve this? I'm running into something very similar.

2 of my 70 custom icons have arrows pointing left which get cut off only in Chrome. My grid is set to 24, and it seems to cut off right at the 19th grid line. Doesn't matter what size the icon renders it though, it always looks the same.

Wish I could include a screenshot here... I can send you my files.

Reply all
Reply to author
Forward
0 new messages