text-truncate adding extra height to display block elements

Prerequisites

• I have searched for duplicate or closed issues
• I have validated any HTML to avoid common problems
• I have read the contributing guidelines

Describe the issue

when we add display block elements with text-truncate, it adds little extra space in the bottom.
check here: https://codepen.io/jeysaravana/pen/YzaOZzd

adding vertical-align: top; to inline style or adding align-top to the same elements are not fixing the issue.

only way to fix the issue is adding vertical-align: top; to text-truncate will fix the issue.

.text-truncate {
    vertical-align: top;
}

Reduced test cases

adding vertical-align: top; to text-truncate will fix the issue.

.text-truncate {
    vertical-align: top;
}

What operating system(s) are you seeing the problem on?

macOS

What browser(s) are you seeing the problem on?

Firefox

What version of Bootstrap are you using?

5.0.2

Start by reproducing the CodePen example in Firefox on macOS and inspect the .text-truncate styling described in the issue. Confirm the extra height for display block elements and verify that the completed change removes the unwanted bottom space without breaking truncation.