I'm dealing with a table that has only one row containing text with new-line characters, such as:
<td id='line-numbers'>
<span class="number" id="1">1</span><br>
<span class="number" id="2">123</span><br>
<span class="number" id="3">31111</span><br>
</td>
For the CSS aspect, I've added margin-right: 15px to line-numbers. Now, I want to add images at the end of each row, like so:
<td id='line-numbers'>
<span class="number" id="1">1</span><img ...><br>
<span class="number" id="2">123</span><img ...><br>
<span class="number" id="3">31111</span><img ...><br>
I'm looking for a way to align these images to the right, in the margin area on the right side, matching the font height (with the width scaled accordingly). Any suggestions on how to do this effectively would be appreciated.
Thank you.
p.s. I have considered adding an additional column on the right, but it's challenging to match without text (except for line breaks). Separating each line into individual tables is not currently an option.