JSFiddle - React, Tailwind, and code Playground

HTML

<div class="inhalt">
  <h3>Feiern</h3>
  <p><a href="#lied_25">25</a><a href="hofbraeuhaus.htm">In München steht ein Hofbräuhaus</a></p>
  <p><a href="#lied_29">29</a><a href="so_ein_tag_so_wunderschoen.htm">So ein Tag, so wunderschön wie heute</a></p>
</div>

<div class="inhalt">
  <h3>Im Hafen und auf See</h3>
  <p><a href="#lied_26">26</a><a href="auf_der_reeperbahn.htm">Auf der Reeperbahn</a></p>
  <p><a href="#lied_29">29</a><a href="heut_geht_es_an_bord.htm">Heut geht es an Bord (hell die Gläser klingen)</a></p>
  <p><a href="#lied_27">27</a><a href="schoen_ist_die_liebe_im_hafen.htm">Schön ist die Liebe im Hafen</a></p>
  <p><a href="#lied_28">28</a><a href="ueber_uns_der_blaue_himmel.htm">Über uns der blaue Himmel</a></p>
  <p><a href="#lied_24">24</a><a href="wir_lagen_vor_madagaskar.htm">Wir lagen vor Madagaskar</a></p>
</div>

CSS

.inhalt {
  display: inline-block;
  vertical-align: top;
  margin: 20px 20px 0 0;
  min-width: calc(45% - 40px);
}
p, h3 {
  margin: 0;
  min-width: 350px;
}
p {
  border-bottom: 1px dotted #0a0;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
}
p a:first-child {
  float: right;
  padding-left: 40px;
}