Facebook Connect - displaying profile pictures the best way

Question

I have a site set up with Facebook connect. I also have profile pages, which show users Facebook profile pictures. If users are not connected via Facebook they still have the option to use a profile picture by entering the url of it.

The Facebook images are using the type=large so they are the true Facebook size (I think). Now the problem I have is, what if someone uses such a large image? And it ruins the UI of the page? I cannot set the size of the image (via HTML) as it will not look right for the Facebook profile images.

What's the best way of going about this? By the way I'm using php.

Thanks

Answer 1

If you have a fixed width/height for your image holder, you can set ONLY the width or height of the image via HTML in your <img> (preserves aspect ratio), then set overflow:hidden on it to preserve your UI. Depending on the design of your page you might also want to add a background color or image to it.