Media Query iPad problem

[Creation22D]

Hey there,

Amateur here trying to learn RWD and I've got an issue with targeting iPad's which is baffling me. I perhaps foolishly tried to convert the old 960 static grid to responsive as I thought it would be a better learning exercise than using a fluid grid framework, but I think that's causing issues in itself.

Scaling the browser on a desktop seems to work, as does viewing the site on an iPhone but when viewing the site on the iPad, it seems to pick up styling from a kind of 'limbo' between the desktop and iPhone queries.

Here's the link:

http://tomliveshere.com/Decindex.html

If you scale it down on the desktop, there's actually a moment where you can get the same effect, I'm assuming that's at 768px width. I can't work out what's going on so any help is appreciated.

Also, there appears to be a white bar down the right hand side of the screen when viewing on an iPhone or iPad. Any ideas?

Thanks

[Creation22D]

Ok I think I've sorted the main problem. Any size between 480 and 768 was undefined and appeared to be a broken combination of both the iPhone and iPad styles.

It's still broken on the iPhone/iPad though. The alignment looks out and there's a white strip along the right-hand edge. Works fine in the desktop browser though.

Any ideas?

[Creation22D]

Fixed it. The width percentage was wrong on the grid stylesheet.

All working now!