I've asked this earlier and Smug gave an idea which still is not working for me so I'm going to try again with a little more info and less complications. I have a png, created in photoshop, size 640 px x 1136px, the size of the iphone 5 screen. I have a div, .picture, styled the following way: .picture {position:relative;width:640px;height:1136px;background-image:url("eye.png"); background-repeat:no-repeat; background-position:center;border:2px;border-color:black;border-style:solid} In the simulator, the div comes up with the height correct, but the width is only about 2/3 of the actual width of the device. The png occupies this entire div area as it should since it's the same size, but again this is the same size as the phone's screen is supposed to be yet at least on the simulator it's only 2/3 the width as I've said. If I try to increase the width in the style it just moves the png over to the right but keeps it the same width. What can be done about this? Thanks. Steve

Why don;t you just make that image your background on the control panel and make it full screen.

That worked very well! Strangely, making the background full screen preserving ratio, did not show the full length. I had to change the length in photoshop to be 1000 px for some strange reason which I don't understand since the iphone 5's height is supposed to be 1136 but I'll take what I can get and this has been the best solution to my problem so far. Thanks again.

Hi Stevek, Just my thoughts: 1. You create file that is the full width of the phone and after that you put a border around it of 2px. This make your total bigger than the iPhone screen. 2. What happens if you rename your image as [email protected] ? Does this make any difference? Best Regards, Danny