Answers.Body: <p>I find out that <code>svg</code> actually doens't support <code>rem</code> units. Though it works elsewere it doesn't work for Kindle. Correct is basically to use any other unit than <code>rem</code>. Even <code>em</code> is possible. But I used <code>px</code> Now it works also in Kindle.</p>
  <pre><code>&lt;?xml version=&quot;1.0&quot; encoding=&quot;utf-8&quot;?&gt;
  &lt;!DOCTYPE html&gt;
  &lt;html xmlns=&quot;http://www.w3.org/1999/xhtml&quot; xmlns:epub=&quot;http://www.idpf.org/2007/ops&quot;&gt;
  &lt;head&gt;
      &lt;title&gt;Unknown&lt;/title&gt;
      &lt;meta http-equiv=&quot;Content-Type&quot; content=&quot;text/html; charset=utf-8&quot;/&gt;
    &lt;/head&gt;
    &lt;body class=&quot;calibre&quot;&gt;
         &lt;p&gt;px&lt;/p&gt;
         &lt;svg xmlns=&quot;http://www.w3.org/2000/svg&quot; style=&quot;width:50px;height:50px;&quot;
           viewBox=&quot;0 0 100 100&quot;&gt;
           &lt;circle cx=&quot;50&quot; cy=&quot;50&quot; r=&quot;40&quot; stroke=&quot;black&quot; stroke-width=&quot;3&quot; fill=&quot;red&quot;/&gt;
         &lt;/svg&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2024-08-17T16:17:05.203Z
Answers.LastActivityDate: 2024-08-17T16:17:05.203Z
Answers.UserDisplayName: Vit Bernatik
Body: <p>I had my document showing simplest svg. It was working elsewhere (calibre, google play books) but not Kindle.</p>
  <pre><code>&lt;?xml version=&quot;1.0&quot; encoding=&quot;utf-8&quot;?&gt;
  &lt;!DOCTYPE html&gt;
  &lt;html xmlns=&quot;http://www.w3.org/1999/xhtml&quot; xmlns:epub=&quot;http://www.idpf.org/2007/ops&quot;&gt;
  &lt;head&gt;
      &lt;title&gt;Unknown&lt;/title&gt;
      &lt;meta http-equiv=&quot;Content-Type&quot; content=&quot;text/html; charset=utf-8&quot;/&gt;
    &lt;/head&gt;
    &lt;body class=&quot;calibre&quot;&gt;
         &lt;p&gt;rem&lt;/p&gt;
         &lt;svg xmlns=&quot;http://www.w3.org/2000/svg&quot; style=&quot;width:3rem;height:3rem;&quot;
           viewBox=&quot;0 0 100 100&quot;&gt;
           &lt;circle cx=&quot;50&quot; cy=&quot;50&quot; r=&quot;40&quot; stroke=&quot;black&quot; stroke-width=&quot;3&quot; fill=&quot;red&quot;/&gt;
         &lt;/svg&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  <p>I had <code>opf</code> file correctly set with <code>properties=&quot;svg&quot;</code></p>
  <pre><code>&lt;item id=&quot;html&quot; href=&quot;tst.html&quot; media-type=&quot;application/xhtml+xml&quot; properties=&quot;svg&quot;/&gt;
  </code></pre>
  
Tags: <kindle><svg>
Title: I did epub with svg and it worked on google play books and calibre but not kindle, what might be an issue?
UserDisplayName: Vit Bernatik
ThreadText: # I did epub with svg and it worked on google play books and calibre but not kindle, what might be an issue?
  
  (Asked by: username_0 on 2024-08-17)
  
  I had my document showing simplest svg. It was working elsewhere (calibre, google play books) but not Kindle.
  
  ```
  <?xml version="1.0" encoding="utf-8"?>
  <!DOCTYPE html>
  <html xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops">
  <head>
      <title>Unknown</title>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    </head>
    <body class="calibre">
         <p>rem</p>
         <svg xmlns="http://www.w3.org/2000/svg" style="width:3rem;height:3rem;"
           viewBox="0 0 100 100">
           <circle cx="50" cy="50" r="40" stroke="black" stroke-width="3" fill="red"/>
         </svg>
  </body>
  </html>
  
  ```
  
  I had `opf` file correctly set with `properties="svg"`
  
  ```
  <item id="html" href="tst.html" media-type="application/xhtml+xml" properties="svg"/>
  
  ```
  
  **Tags:** kindle, svg
  
  
  ---
  
  ## 1 answers
  
  ### Answer by username_0 on 2024-08-17. Score: 0
  
  I find out that `svg` actually doens't support `rem` units. Though it works elsewere it doesn't work for Kindle. Correct is basically to use any other unit than `rem`. Even `em` is possible. But I used `px` Now it works also in Kindle.
  
  ```
  <?xml version="1.0" encoding="utf-8"?>
  <!DOCTYPE html>
  <html xmlns="http://www.w3.org/1999/xhtml" xmlns:epub="http://www.idpf.org/2007/ops">
  <head>
      <title>Unknown</title>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    </head>
    <body class="calibre">
         <p>px</p>
         <svg xmlns="http://www.w3.org/2000/svg" style="width:50px;height:50px;"
           viewBox="0 0 100 100">
           <circle cx="50" cy="50" r="40" stroke="black" stroke-width="3" fill="red"/>
         </svg>
  </body>
  </html>
  
  ```
  
  
  ---
  
  