how to render text in small viewbox

I am so confused in rendering font in small viewbox

Following is a simple svg to show text
this works
<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/css" href="style.css"
         ?>
<svg width="560" height="560" preserveAspectRatio="XMidYMid" viewBox="20 20 1 
1">

<text x='20.1' y='20.1' font-size="0.01em">0.01em</text>
<text x='20.5' y='20.5' font-size="0.1">0.1</text>

</svg>

but, this svg doesn't work, the only difference is the viewbox's orgin is 30,30
instead of 20,20
<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/css" href="style.css"
         ?>
<svg width="560" height="560" preserveAspectRatio="XMidYMid" viewBox="30 30 1 
1">

<text x='30.1' y='30.1' font-size="0.01em">0.01em</text>
<text x='30.5' y='30.5' font-size="0.1">0.1</text>

</svg>
 
I do not know what happened , how to render text in viewbox such as '-80, -30, 
1, 1"

thank you

Received on Friday, 20 July 2001 16:03:56 UTC