CSS Issue: Sentences do not start from the same starting point

Question

I want to achieve the following appearance of my page:

Instead, what I have right now is the following:

0023230123 - The item has blab babrf fhgdf fdgdfg fdgfdg fdgfd fdgdf fdgdf fdgvberg
and also dfsd sddexf.

In other words, I want that the item Description, if it is too long for one line, I want the second (third, forth etc) line will begin from the same point as the first line.

My code is as follows:

item.id is the numeric identifier of the item: 0023230123

item.Description is the text: The item has blab babrf fhgdf fdgdfg fdgfdg fdgfd fdgdf fdgdf fdgvberg and also dfsd sddexf.

Any suggustion on how to achieve this, please?

Answer 1

That sounds an awful lot like it's tabular data, in which case that kind of layout would come pretty much for free.

<table>
    <thead>
        <tr>
            <th>ID</th>
            <th>Description</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>0213515351</td>
            <td>This item has bla bla bla and also sdljfhbsdf lsjhdbfsjlhdbfsjhdfbsjhdbf</td>
        </tr>
    </tbody>
</table>