This is a read-only archive of the Framer Community on Facebook.

What is Framer? Join the Community
Return to index
Brian Saunders
Posted Jun 17 - Read on Facebook

Hey everyone, thank you to the development team for building such a useful tool. I'm wondering if anyone can tell me why my circle graphics are getting clipped on the right edge. The PNGs don't have the same problem and I'm sure the dimensions I've specified are correct. Specifying a larger width reveals the complete circle, but if I do that the whole image scales proportionally and breaks the layout. Any ideas?

https://dl.dropboxusercontent.com/u/65823959/my-colleges/index.html

8 Comments

Dae Hyuk Yoon

Are you using photoshop or sketch?

Brian Saunders

I used sketch to create and export the images, but I didn't use the generator. I defined the views myself.

Gary Jacobs

Do you have strokes/borders on your circles?

Brian Saunders

Interesting, yes, there is an inner border on the active state. It's part of the image though, and hasn't been handled with CSS or anything like that.

Tisho Georgiev

The size of your images doesn't match the size of your layers, which is why they appear clipped. circle-search-active.png, for example, is 167x204, but in app.js you give it a size of 167x209. Fix those and it should be fine.

Brian Saunders

Wow, you got me there. I was sure I had that part right. Thanks!

Brian Saunders

An interesting thing to note – although my slices have the exact same dimensions in Sketch, they exported at slightly different sizes. Weird issue.

Tisho Georgiev

Maybe you have "Trim transparent pixels" on?

Read the entire post on Facebook