Row splitting in a dynamic HTML table using XSL and XML

I'm trying to split a loop using XSL in to a second row but am not sure how to approach this. Let me show you my code to explain.

XML

<main>
<book>
    <name>Harry Potter 1</name>
    <pages>347</pages>
    <authors>
        <name>J.K Rowling</name>
        <age>49</age>
    </authors>
    <authors>
        <name>Dan Brown</name>
        <age>59</age>
    </authors>
</book>
<book>
    <name>Harry Potter 2</name>
    <pages>800</pages>
    <authors>
        <name>J.K Rowling</name>
        <age>49</age>
    </authors>
    <authors>
        <name>Barack Obama</name>
        <age>40</age>
    </authors>
</book>

XSL

<table class="table table-bordered" border="1">

<xsl:for-each select="main/book">
    <tr>
        <td><xsl:value-of select="name" /></td>
        <td><xsl:value-of select="pages" /></td>
        <xsl:for-each select="./authors">
            <td><xsl:value-of select="name" /></td>
            <td><xsl:value-of select="age" /></td>
        </xsl:for-each>
    </tr>
</xsl:for-each>
</table> 

Currently this outputs something like this.

What I would like to accomplish is something like this

As you can see the authors are not stacked below each other and not next to each other.

Can anyone shed some light on this for me? I would greatly appreciate it! Thank you for reading.