Balance tables with CSS

I have these tables that get created by Parsedown, a PHP based Markdown parser that does its job well.

The end result of tables in a browser is abominable though, I've included a screenshot to show what I mean.

In this two column table, I expect the left column to be significantly smaller than the right one. Normally I would just manually fix a table like this, but since the table is generated by Parsedown I can't.

I also cannot use table-layout: fixed globally since I have to accommodate for tables of all shapes and sizes.

Has anyone a solution, or just a place to start looking for one?

Just to be complete here is the generated HTML for this table:

<table>
    <thead>
        <tr>
            <th></th>
            <th></th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Small content</td>
            <td>Large content</td>
        </tr>
        <tr>
            <td>Small content</td>
            <td>Large content</td>
        </tr>
        <tr>
            <td>Small content</td>
            <td>Large content</td>
        </tr>
    </tbody>
</table>

The full computed CSS in Chrome:

I know readability can be increased easily by adding width: 1%; to all th and td in a table. You can try the css snippet below. Dont know if your restrictions are very high but if you can add classes to your tables I highly recommend using the bootstrap css for tables.

table {
  width: 100%;
  max-width: 100%;
  border-collapse: collapse;
}

table th,
table td {
  width: 1%;
  padding: .5rem;
  vertical-align: top;
}

table thead th {
  vertical-align: bottom;
}