I understand that the following html and css code should work for making websites responsive in iphones:

The html code
HTML Code:
<meta name="viewport" content="width=device-width, initial-scale=1">
The css code
@media screen and (max-device-width: 500px) and (-webkit-min-device-pixel-ratio: 2),
only screen and (max-device-width : 500px) {
I have tried several iphone simulators and it appears to not be working as the full size is squashed and shown. What code do I need to make my website responsive in iphones?