What is the iPhone screen resolution?

You need the viewport meta tag to tell the iPhone your website has been specifically designed for it.

Use this:

<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"/>

You can change the scaling options if you need the user to zoom etc..

Also if you want your app to work in landscape mode as well, you can set the width to 100%.

#wrapper {
    width: 100%
    max-width: 480px;
}

The problem is that the iPhone is trying to scale it on its own. If you put this tag in the head of your page, it will tell the phone "Don't worry, I'll handle the sizing of the content on my own" and will force the screen to a 1:1 ratio.

<meta name = "viewport" content="inital-scale=1.0">

The other answers are correct that you need to configure the viewport.

The official apple documentation on this is here:

https://developer.apple.com/library/archive/documentation/AppleApplications/Reference/SafariWebContent/UsingtheViewport/UsingtheViewport.html

It's worth skimming through the whole document - as well as a lot of description of the viewport tag (complete with pictures!), it also has lots of other useful advice for targeting web pages to the iphone.