Your current problem is probably a little extra CSS added in the cover page by tools that you use which is causing the images to stretch to try to "fill the entire screen" (I HATE THIS WITH A PASSION).
If you do not mind sharing your entire cover.xhtml code so we could take a look?
What I personally do is create a cover.xhtml file and use this code as the template (found this somewhere in the forums a while back):
Code:
<?xml version="1.0" encoding="utf-8" standalone="no"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
</head>
<body>
<div>
<svg xmlns="http://www.w3.org/2000/svg" height="100%" preserveAspectRatio="xMidYMid meet" version="1.1" viewBox="0 0 400 638" width="100%" xmlns:xlink="http://www.w3.org/1999/xlink">
<image width="400" height="638" xlink:href="../Images/cover.jpg"></image>
</svg>
</div>
</body>
</html>
The red numbers will have to be changed to match the Height/Width of your cover image.
The blue section will have to point towards your cover image.
If you need any more questions answered, please feel free to ask, or take a look at the Wiki (there is lots of information there). The Wiki has a slightly different version of this SVG code, but I seem to like the look of the one I posted much better (although I have not tested it on massive amounts of different devices).
https://wiki.mobileread.com/wiki/Ebook_Covers