Marquee Alternativ

Bereits seit Jahren ist das HTML <marquee> Element als veraltet klassifiziert worden. Und immer häufiger werden die modernen Browser-Versionen Kodierungen mit diesem HTML <marquee> Element nicht oder nicht mehr richtig darstellen. Es gibt jedoch eine Möglichkeit um einen ähnlichen <marquee> Effekt mit CSS und HTML zu realisieren. Beispielsweise habe ich diese alternative Kodierung und das Ergebnis hier mal angezeigt (inkl. Link zu dem Aeternus Gästebuch).

<style>
.abstand {
margin-top: 50px;
margin-bottom: 30px;
}
.marquee {
width: 100%;
font-size: 135%;
background-color: #BC401E;
white-space: nowrap;
overflow: hidden;
box-sizing: border-box;
}
.marquee a {
display: inline-block;
margin-top: 4px;
margin-bottom: 6px;
padding-left: 100%;
color: white;
font-weight: normal;
animation: marquee 18s linear infinite;
}

@keyframes marquee {
0% { transform: translate(0, 0); }
100% { transform: translate(-100%, 0); }
}

a:link {text-decoration: none}
a:hover {color: blue}
</style>

<div class="abstand">
<div class="marquee">
<a href="https://www.aeternus.org/gaestebuch/">..... Darf ich Sie einladen eine Nachricht ins Aeternus-Gästebuch einzutragen? .....</a>
</div>
</div>