|  |  |  | 
|---|
|  |  |  | </head> | 
|---|
|  |  |  | <body> | 
|---|
|  |  |  | <h2>@font-face in SVG</h2> | 
|---|
|  |  |  |  | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <p style="width: 500px"><strong>Problem:</strong> I'm trying trying to place an images in svg format with custom fonts. It works in <code>svg</code> but not in  <code>img</code>. If you open the image in a new tab you will see it rendered with the proper font. The font is served from this same website in this directory.</p> | 
|---|
|  |  |  |  | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <a href="test_ff.svg">Link to the test.svg</a> | 
|---|
|  |  |  |  | 
|---|
|  |  |  |  | 
|---|
|  |  |  | <table> | 
|---|
|  |  |  | <tr><td> | 
|---|
|  |  |  | <svg width="500" height="200" version="1.1" xmlns = 'http://www.w3.org/2000/svg' xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 500 200"> | 
|---|
|  |  |  | <svg width="500" height="200" version="1.1" xmlns = 'http://www.w3.org/2000/svg' xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 500 200"> | 
|---|
|  |  |  | <defs> | 
|---|
|  |  |  | <style type="text/css"> | 
|---|
|  |  |  | @font-face { | 
|---|
|  |  |  | 
|---|
|  |  |  | </td> | 
|---|
|  |  |  | <td> | 
|---|
|  |  |  | <pre> | 
|---|
|  |  |  | <svg width="500" height="200" version="1.1" xmlns = 'http://www.w3.org/2000/svg' xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 500 200"> | 
|---|
|  |  |  | <svg width="500" height="200" version="1.1" xmlns = 'http://www.w3.org/2000/svg' xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 500 200"> | 
|---|
|  |  |  | <defs> | 
|---|
|  |  |  | <style type="text/css"> | 
|---|
|  |  |  | @font-face { | 
|---|
|  |  |  | 
|---|
|  |  |  | </pre> | 
|---|
|  |  |  | </td> | 
|---|
|  |  |  | </tr> | 
|---|
|  |  |  | </table> | 
|---|
|  |  |  |  | 
|---|
|  |  |  |  | 
|---|
|  |  |  | </table> | 
|---|
|  |  |  |  | 
|---|
|  |  |  |  | 
|---|
|  |  |  | </body> | 
|---|
|  |  |  | </html> | 
|---|