Images half the size after packaging in Phonegap and opening on WP7
-
02-07-2021 - |
Question
I have a series of images lined up using the following code.
HTML for each image is something like...
<div class="hover panel">
<div class="front">
<img src="breeds/Bluefaced_Leicester.jpg" />
</div>
</div>
CSS is ...
.panel {
float: left;
width: 220px;
height: 220px;
margin: 0px;
padding: 7px;
position: relative;
font-size: .8em;
margin-left: auto;
margin-right: auto;
-webkit-perspective: 600px;
}
.panel img {
width: 100%;
}
Here is what it looks like when I preview it on 480x800 web windows...
Here is what it looks like on the WP7 Emulator...
How can I ensure the images show up as 220px on the WP7?
Solution
My solution to this problem was to double the pixel size of all elements within the applications. Not the best solution but it works.
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow