Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS

Posted by Nicholas Olsen
.a{fill-rule:evenodd;}techdegree
Nicholas Olsen
Front End Web Development Techdegree Student 19,342 Points

Why does my image look wrong on my android? How can I degrade this gracefully?

I have an older Android that is running Android 4.0.4 with Chrome. I just put up a placeholder webpage and when I check it out on my phone, the picture of me doesn't look right. It has a rounded border just as it should, but with a square image in the center.

I've done some research and found that this model of Android didn't support the condensed version of border-radius. The fix is to use "border-top-radius: 50%" and so on. Which I've done, but I'm still getting the same effect.

Has anybody else every deal with this before? Do you have any ideas of how to approach the issue?

Jacob Miller
Jacob Miller
12,466 Points

Just a guess, but did you try adding the -webkit- prefix?

1 Answer

Eric Ellenbrook
Eric Ellenbrook
9,006 Points

Try adding the -webkit- prefix and if that doesn't work you can get the same effect by overlaying a rounded PNG on top of the image that is showing as a square. That's just one option, of course.