This is what I have been experimenting with on my Glo to make images full screen (I am not an expert at this but it seems to work OK):
Code:
<div style="page-break-before:always">
<svg xmlns="http://www.w3.org/2000/svg" width="768px" height="880px" padding-top="20px" preserveAspectRatio="xMidYMid" version="1.1" viewBox="0 0 768 1024" xmlns:xlink="http://www.w3.org/1999/xlink">
<image width="768" height="1024" xlink:href="../Images/map.jpg"></image>
</svg>
</div>
svg width="768px" is the Glo's screen width. svg height="880px" is the Glo's screen height minus a bit for the bottom menu, and a bit more because I have a 20px padding at the top (padding-top="20px") so the image is not right at the top of the screen.
preserveAspectRatio="xMidYMid" positions the image in the middle of the screen.
The viewBox is the user defined coordinate system this can be pretty much whatever you want as long as the aspect ratio is reasonable. To keep things simple I have used the Glo's screen resolution. 480 x 640 or 768 x 1024 will work the same as they are both a 0.75 ratio.
The image width and height are then the same as the viewBox width and height, so the image fills the viewBox.
For the Aura the resolution is 1080 x 1440 (w x h, also a 0.75 ratio), which will be something like:
Code:
<div style="page-break-before:always">
<svg xmlns="http://www.w3.org/2000/svg" width="1080px" height="1400px" padding-top="20px" preserveAspectRatio="xMidYMid" version="1.1" viewBox="0 0 1080 1440" xmlns:xlink="http://www.w3.org/1999/xlink">
<image width="1080" height="1440" xlink:href="../Images/map.jpg"></image>
</svg>
</div>