Displaying a date range with labels, what is the best practice?

So I have a date range, for example:

21-05-2022 - 27-05-2022

Bear in mind that the date is in dd-mm-yyyy format. So my user wanted to add the "Start Date" and "Due date" before the date. So it becomes like this:

Start date: 21-05-2022 - Due date: 27-05-2022

I don't think that's right (at least according to my gut), if you want to use labels I think you need to put line breaks like so:

Start date: 21-05-2022
Due date: 27-05-2022

What do you think? I need some validation for this to present to them. Thank you

UPDATE:

For more context, this is supposed to be displayed in a web page I'm working on. So I'm currently working on a web page, mostly text, with a layout like so:

TITLE OF THE TASK
Start Date: 07-04-2022
Due Date: 17-04-2022

Header 1

Content...

It's not about displaying a date range picker component, it's just displaying the date text. In fact, the date cannot be changed (at least in this page)