Eine (Zwischen-)Überschrift und nachfolgenden Text (oder in deinem Fall Sonderzeichen) in einen Link zu verschachtel, wäre semantisch falsch. Was spricht dagegen, zwei getrennte Links zu verwenden, einen für die Überschrift, einen für das Sonderzeichen?
Übrigens gibt es eine Reihe hübscher Plugins, mit denen die Webseite nach Mausklick wieder ganz sanft und elegant nach oben scrollen, meistens in Verbindung mit jQuery-Animationen.
Wenn ich Überschrift und Sonderzeichen nebeneinander platziere, dann wird das Sonderzeichen als „Fremdkörper“ betrachtet und wandert dadurch automatisch 2 Zeilen unter der Überschrift.
Ich weiß nicht, wie ich das verhindern kann?
h4 id=“Senioren“>» Unterricht für Senioren</h4 … a href=“#“ title=“Nach oben“/>▲</a
Irgendwie muss ich anscheinend eine Verankerung (siehe …) zwischen Überschrift und Sonderzeichen herstellen.
Keine „Verankerung“, sondern passendes CSS:
<style>
* { margin: 0; padding: 0;} /* besser wäre eine reset.css */
h4:before { content: "» "; } /* besser wegen SEO */
h4 { margin: 0; padding: 0; }
.nachoben, .nachoben a { color: red; margin: 0; padding: 0; }
</style>
<h4 id="Senioren">Unterricht für Senioren</h4>
<div class="nachoben">
<a href="#" title="nach oben">▲</a>
</div>
Vielen Dank für die Mühe, aber leider bleibt bei der Anwendung deines Vorschlags das Sonderzeichen nicht wie erwünscht in der gleichen Zeile wie die Überschrift, sondern wandert unter die Überschrift.
Ach, OK, dann habe ich dich da falsch verstanden.
Neuer Vorschlag:
<style>
h4 { display: inline-block; margin: 0; padding: 0; float: left; }
h4:before { content: "» "; } /* besser wegen SEO */
.nachoben { margin: 0 10px; line-height: 20px;}
</style>
<h4 id="Senioren"><a href=#>Unterricht für Senioren</a></h4><a href=# class="nachoben">▲</a>
