User#221: CSS-Ersatz für &nbsp

Hallo Leute,

was ist die CSS-Alternative von "&nbsp" für einen Leerraum zwischen zwei img-Tags innerhalb einer Liste(li) oder eines divs?

Ich finde im Netz nur "white-space" oÄ., das eher für Text relevant ist.

Danke!

Cu,
User#221

  1. Hallo,

    was ist die CSS-Alternative von "&nbsp" für einen Leerraum zwischen zwei img-Tags innerhalb einer Liste(li) oder eines divs?

    Du könntest zum Beispiel padding verwenden.

    Freundliche Grüße

    Vinzenz

    1. Hallo Vinzenz,

      padding, sofern ich weiß, ist der Abstand zwischen dem Element und den Element-Grenzen. Ich möchte es wissen, wenn Du zwei kleine Bilder innerhalb einer Liste oder Divs hast, wie Du den weißen Abstand zwischen den Elementen angibst und nicht zwischen den beiden Elementen zusammen und den Element- Grenzen.

      Cu,
      User#221

      1. padding, sofern ich weiß, ist der Abstand zwischen dem Element und den Element-Grenzen.

        Ja.

        Ich möchte es wissen, wenn Du zwei kleine Bilder innerhalb einer Liste oder Divs hast, wie Du den weißen Abstand zwischen den Elementen angibst und nicht zwischen den beiden Elementen zusammen und den Element- Grenzen.

        Davon sprach auch keiner - oder bist du der Meinung, img-Elemente könnten kein padding haben?

        1. OK suit,
          habe ich es kapiert:
          man kann jedem einzelnen Element, das in einem Div oder einer Liste verschachtelt ist, padding eingeben. Somit kann man benutzerdefinierte Abstände unabhängig vom Elementtyp erzeugen.

          Danke!
          User#221

          1. habe ich es kapiert:
            man kann jedem einzelnen Element, das in einem Div oder einer Liste verschachtelt ist, padding eingeben. Somit kann man benutzerdefinierte Abstände unabhängig vom Elementtyp erzeugen.

            Prinzipiell ja - aber auch hier gibt es Browser- und Systembedingt manchmal Ausnahmen - input[type=file] ist z.B. so eine Ausnahme.

      2. Hallo,

        padding, sofern ich weiß, ist der Abstand zwischen dem Element und den Element-Grenzen.

        inwiefern stellt dies ein Problem dar. Du hast das erste Bild als Element, das an das zweite Bild, ein weiteres Element, grenzt.

        Ich möchte es wissen, wenn Du zwei kleine Bilder innerhalb einer Liste oder Divs hast, wie Du den weißen Abstand zwischen den Elementen angibst und nicht zwischen den beiden Elementen zusammen und den Element- Grenzen.

        a) dem ersten Bild einen passenden Wert für padding-right und/oder dem zweiten
           Bild einen passenden Wert für padding-left geben,
        b) dafür sorgen, dass das umgebende Element einen weißen Hintergrund besitzt.

        Freundliche Grüße

        Vinzenz

        1. a) dem ersten Bild einen passenden Wert für padding-right und/oder dem zweiten

          Dafür eignet sich natürlich mal wieder der Adjacent-Sibling Selector.

          img+img { padding-left: 10px; }

        2. Super Antwort Vinzenz,

          eine professionelle Beschreibung!

          Danke!
          user#221

  2. was ist die CSS-Alternative von "&nbsp" für einen Leerraum zwischen zwei img-Tags innerhalb einer Liste(li) oder eines divs?

    Was ist die vegetarische Alternative für einen Apfel ich trotzdem Fleisch essen möchte? ;)

    Die richtige Antwort hat dir Vinzenz bereits gegeben.

    Für ein geschütztes Leerzeichen kann es keine CSS-Alternative geben, da ein geschütztes Leerzeichen Inhalt ist und niemals nur zu präsentationszwecken dient - sprich es ist nicht dafür da einen Abstand zu erzeugen, sein Zweck ist einen Umbruch zu verhindern.

    1. @ suit,

      danke für die HTML-Lehre. Das geschütze Leerzeichen ist doch unersetzbar.?

      cu,
      User#221

      1. danke für die HTML-Lehre. Das geschütze Leerzeichen ist doch unersetzbar.?

        Unersetzbar ist es nicht, aber es ist unsinnig es mit CSS reproduzieren zu wollen da das geschützte Leerzeichen Inhalt ist, nicht Präsentation.

        10 m

        vs.

        <span class="white-space: no-wrap;">10 m</span>

        Im Falle eines Textbrowsers oder abgeschaltetem CSS könnte hier das Einheitensymbol in die nächste Zeile rutschen - warum sollte man sowas wollen?

        Natürlich mag es auch hier Ausnahmefälle geben - mir fällt spontan aber keiner ein.

        1. <span class="white-space: no-wrap;">10 m</span>

          pardon: white-space: nowrap;

        2. @@suit:

          nuqneH

          10&nbsp;m

          BTW, das richtige[tm] Zeichen zwischen Zahl und Einheit wäre NNBSP: 10&#x202F;m

          Qapla'

          --
          Gut sein ist edel. Andere lehren, gut zu sein, ist noch edler. Und einfacher.
          (Mark Twain)
          1. BTW, das richtige[tm] Zeichen zwischen Zahl und Einheit wäre NNBSP: 10&#x202F;m

            Wie siehts hier mit Kompatiblität aus? Ist das Zeichen in gängigen Schriftarten überhaupt enthalten? THIN SPACE (U+2009) hat hier ja auch entsprechende Probleme.