Hi,
I have seen an image on a children's book and I try to reproduce it on an EPUB2. Basically, I use:
- a png image (about 50% percent of its surface is transparent) as a background-image
- a svg image containing two blocks of text which is supposed to display within the transparent part of the background image.
The results so far are not that great. Both images display fine but my problem is that they coincide not perfectly. Could someone have a look at the code of the page?
Spoiler:
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xml:lang="fr-FR" xmlns="http://www.w3.org/1999/xhtml">
<!-- This file was converted to xhtml by Writer2xhtml ver. 1.5.1. See
http://writer2latex.sourceforge.net for more info. -->
<head>
<title>Libertine</title>
<link href="styles/styles.css" rel="stylesheet" type="text/css" />
<link href="styles/styles1.css" rel="stylesheet" type="text/css" />
<style type="text/css">
body {
background-image: url(enfant.png);
background-repeat:no-repeat;
margin: 0 0 0 0;
}
</style>
</head>
<body>
<div>
<img alt="Image" src="texte-enfant.svg" style="width:100%" />
</div>
</body>
</html>