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
Joe Buglio
5,714 PointsProfile picture looks stretched out when I resize the image. Not sure how to fix it.
I looked inside the CSS code to see the dimensions of the height and width of the profile photo. Went into Photoshop and changed the image size to fit the dimensions but when i upload the picture in the code and load the page the image is stretched out. Looks compressed. Not sure exactly how to fix the problem.
1 Answer
eric robertson
4,876 PointsMake sure you are exporting the intended dimensions from Photoshop, in the Save for Web panel you should be able to confirm this before you save the file out. Next make sure that you are referencing the correct image file in your html, and finally, where I think the issue probably lies, is in the height and width declarations for the particular element. If you are targeting the <img> tag as a descendant selector you will likely experience issues. I would add a class to the <img> tag and specify the width as 100%. If this produces some odd results I would then add the exact pixel dimensions in the width and height declaration. Check the parent elements to make sure something is not being overridden. Last option would be to add a style inline with the <img> tag. A little crude but it will override any other styles that are being applied to it.