I'm using jQuery Mobile to create a small app. I have a GIF which is displayed. It works fine on iPhone 4, but when I go to iPhone 5 or Windows Phone, I get a blank space at the bottom for iPhone 5, and I get a blank space for both buttom and right sides in Windows Phone. So, whatever the size of the device, I want the GIF to stretch and fill the whole div. I already searched through and tried some answers from similar questions, but no luck, maybe because they don't use jQuery Mobile, or because they use older version of CSS. Anyway, below you can find my HTML.
<div id="correctGIF" data-role="page" data-add-back-btn="false">
<img src="images/Correct1.gif" class="cor">
</div>
I tried this CSS, but no luck:
#correctGIF {
width: 100%;
height: 100%;
position: fixed;
left: 0px;
top: 0px;
z-index: -1;
}
.cor {
width: 100%;
height: 100%;
}