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!

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

General Discussion

Kelvin Knighton
Kelvin Knighton
6,168 Points
Posted by Kelvin Knighton
Kelvin Knighton
6,168 Points

uploading context, picture is wrong direction

could you visit my site, and help me get the photo right, i had it right several time before, but it's like it works sometimes and sometimes not, me messing with sublime text 2 viewing the page in the browser.

http://kelvinknighton.com/

Kelvin Knighton
Kelvin Knighton
6,168 Points
Kelvin Knighton
Kelvin Knighton
6,168 Points

it's working on the iphone portrait view and landscape

5 Answers

Jason Anello
PLUS
Jason Anello
Courses Plus Student 94,610 Points
Jason Anello
Jason Anello
Courses Plus Student 94,610 Points

The image itself is rotated. It's not anything happening in css. The camera was probably turned when that picture was taken.

You need to rotate it in an image editing program. You should also scale it down because it's currently 1.9MB in size.

Kelvin Knighton
Kelvin Knighton
6,168 Points
Kelvin Knighton
Kelvin Knighton
6,168 Points

thx man, i will edit and reply if working

Kelvin Knighton
Kelvin Knighton
6,168 Points
Kelvin Knighton
Kelvin Knighton
6,168 Points

your advice worked, do you still think the image is large, should i still down size?

Jason Anello
PLUS
Jason Anello
Courses Plus Student 94,610 Points
Jason Anello
Jason Anello
Courses Plus Student 94,610 Points

That's an improvement. It's only 609KB now but it could probably be better. Currently you're having the css scale the image down to 400px. You could simply make your image 400px natively in your image application. In general, you shouldn't serve larger images than what you're going to show on the screen.

You're doing the exact opposite with your social icons. Those images are only 46x46 (I think) and you're scaling them up to 400px wide in the css. This causes them to be pixelated. You would need to have larger images. In general though, you probably would not see social icons that large on a website. Usually they're small icons that you might put in the header or footer of your page, for example.

Kelvin Knighton
Kelvin Knighton
6,168 Points
Kelvin Knighton
Kelvin Knighton
6,168 Points

ok i fixed the image in a native app to (-- width: 7.9 -- height: 10:58--)
and i delete the css, both of the twitter and facebook icons are 0.64 and i don't have them in css, i do have them in a span, but even when i didn't have them in a span they are still doing the same, i want these to be normal small icons and the footer of my page, i'm going to put it in a footer and see if this works, thank you for your aiding me.