Is there a way to align right for sequential elements according to the end of the first line in HTML?

Viewed 44

enter image description here

I need to align this text right to left but not from the farthest point on the page and am unsure of how to do so using the end of the first line as the reference point to start the text align right.

1 Answers

.wrapper {
  display: inline-block;
  text-align: right;
}
<div class="wrapper">
  <div>longest line of text</div>
  <div>line of text</div>
  <div>line of text</div>
</div>

Can't test at the moment but that should be what you're looking for. Inline block wrapper "shrinks" to size of content which is the widest block, the child block elements will naturally expand to be the width of the parent.

Related