How to change markdown image size in Vue 3/Laravel Nova/CSS?

I am fetching markdown from a database:

    const state = reactive({
        content: ""
    })
    
    axios.get('/legal')
        .then(res => {
            const data = res.data
            state.content = DOMPurify.sanitize(marked(data['content']))
        })

And rendering it in my vue component like so:

    <div class="text-container">
      <div v-html="state.content"></div>
    </div>

The problem is that the image gets rendered too large and stretches the whole page:

I've tried to change the image size in CSS but none of my selectors work:

    .text-container {}
    .text-container img {}
    .text-container p img {}

I've also tried fiddling with parent element sizes but the image just overflows out of the parent element.

The markdown is created in a laravel nova backend CMS like so:

## Statute

Lorem ipsum dolor sit amet, consectetur adipisicing elit. A adipisci assumenda beatae commodi delectus dolor doloribus ducimus et eum facilis fugit ipsum iusto laboriosam maiores, minus molestias non nostrum obcaecati officia pariatur, quisquam repellat reprehenderit sit soluta totam! Hic, iste?

![Reiner](https://www.reflect.de/wp-content/uploads/2018/01/78_2.1.jpg)

Nova Resource Fields:

public function fields(Request $request)
{
    return [
        ID::make(__('ID'), 'id')->sortable(),

        Markdown::make('Content')->alwaysShow(),

    ];
}

And is rendered into html by vue/laravel/mix like so:

Is there any way I can change the markdown image size (preferably CSS) without my client having to write html on his end in the markdown editor?