[ERLEDIGT] <a> innerhalb von <p> mit Leerzeichen...

[annsen]

Kann ich Links (<a>-tags) in <p>-Tags platzieren?

Es sollen 3 Links (Seite A / Seite B / Seite C) hintereinander erscheinen und die ersten beiden werden in einem Satz zusammengefasst:

"Seite A & Seite B blablabla. Seite C"

<div class="links">
<p><a href="seite_a.html">Seite A</a>& <a href="seite_b.html">Seite B</a>blablabla. </p><a href="seite_c.html">Seite C</a>
</div>

Das Problem: das Leerzeichen vor "Seite C" (Link3) verschwindet, obwohl ich nach "blablabla" ein Freizeichen lasse, wie nach dem "&":

"Seite A & Seite B blablabla.Seite C"

Bisher hatte ich diese 3 Links einfach als 3 <a>-Tags nebeneinander angelegt aber als Satz wirkt es an der Stelle (optisch) viel besser. Welche Möglichkeiten habe ich denn da?

 

[threadi]

Das liegt am "&" welches Du schreiben willst. Du musst es HTML-kodiert schreiben:

&

Und natürlich kann man beliebig viele Links in Absätzen schreiben :)

 

[annsen]

Das liegt am "&" welches Du schreiben willst. Du musst es HTML-kodiert schreiben:

&

Aber ich dachte per UTF-8 kann ich mir das sparen?

Das "& " wird ja eigentlich auch richtig angezeigt (inklusive Leerzeichen), nur das LEERZEICHEN am Ende des Satzes (vor dem 3. Link) wird nicht abgebildet.
VOR dem & wird (ohne, dass ich es frei lasse) ja auch ein Leerzeichen eingefügt - als ob das <a>-Tag das automatisch macht. Leider habe ich bisher keine Quelle gefunden in der erklärt ist, wie sich das mit den Leerzeichen genau verhält...

 

[annsen]

Und könnt ihr mir sagen, warum das Leerzeichen VOR dem "&" ohne, dass ich es im HTML-Code freigelassen habe, eingefügt wird? Ist das <a>-Tag dafür verantwortlich? (also wird nach einem <a>-Tag immer ein Leerzeichen eingefügt?)

 

[threadi]

Nein, das ist bei Links nicht vorgesehen.

 

[annsen]

Das p-Tag wird schon nach dem blablabla geschlossen. Daher zeigt mein Browser nicht das an, was Du gepostet hast

sondern

Ist das wirklich deine Absicht?

Die 3 Links (ursprünglich 3 <a>´s und jetzt der Satz (<p> mit 2x<a> und 1x<a>) stehen in einer Flexbox (row) und somit nebeneinander.

Hmmm... ich gehe die Zeilen jetzt nochmal genau durch - irgendwo muss ja der Fehler liegen.

 

[annsen]

Das kann einiges erklären.
Wenn ich dieses HTML verwende:

    <div class="links" style="display:flex;">
        <p><a href="seite_a.html">Seite A</a> & <a href="seite_b.html">Seite B</a> blablabla. <a href="seite_c.html">Seite C</a></p>
    </div>

bleiben alle Leerzeichen erhalten, mein Browser (Opera) zeigt es so an:

OK, daraufhin hab ich das nochmal gecheckt. Es war ein (Anfänger)-Fehler - ich hab was falsch gemacht.
Die <a>-Tags hatten im CSS teilweise einen margin von 0.5rem. Ich hab den <a>-Tags im Footer jetzt eine eigene Klasse zugeordnet und schon funktioniert es perfekt!

Vielen Dank für eure Hinweise!! Wie (fast) immer: TOP!!! :)