CSS: Zeilenabstand von Text reduzieren?

Lesezeit: 3 Minuten

CSS Zeilenabstand von Text reduzieren
Benutzer2649496

Ich habe Schwierigkeiten, den Abstand zwischen Textzeilen mit CSS line-height (oder height – ich habe beides versucht) zu reduzieren.

Ich habe ein kleines bisschen Text und der Abstand ist ausgeschaltet. Ich habe versucht, die Stile zu ändern, die (scheinbar) gelten, und den Text auch in a einzuschließen <span>...</span> und den Stil explizit zu deklarieren. Nichts scheint zu funktionieren.

Die Seite ist eine WordPress-Seite, die das „lite“-Thema von Pagelines verwendet. Die URL ist http://stage.dsthree.com und das Problem befindet sich auf der Titelseite (Sie können es in der vierten Textspalte sehen, direkt unter dem Feld “E-Mail-Abonnement” im kleinen Text – der Zeilenabstand für diesen Text ist deaktiviert. Diese Website erlaubt mir nicht, zu posten ein Screenshot, da ich neu hier bin.

Ich habe die Zeilenhöhe auf 1% und auf 1px ohne Wirkung reduziert.

Jede Hilfe, Anleitung oder Vorschläge zur Reduzierung der Leerzeichen sind sehr willkommen!

  • Poste einen Code. Geben Sie den vollständigen Kontext an, wie der HTML-Code für den Text strukturiert ist, den Sie anpassen möchten. Anders als a <span> ist der Text in einem anderen Element? EIN <p>?

    – matthewpavkov

    9. August 2013 um 16:11 Uhr

Inline-Elemente berücksichtigen keine Eigenschaften wie z line-height; sie nehmen die Zeilenhöhe des nächsten übergeordneten Blocks an.

Sehen Geige

Lösung: Entfernen Sie die Zeilenhöhe aus dem Körper oder verwandeln Sie die Spanne in einen Block (dh machen Sie daraus ein Div; geben Sie nicht display:block zur Spannweite).

  • Dies hat es gelöst. Es zu einem

    zu machen, gab mir die Kontrolle über die Zeilenhöhe, die ich brauchte. Danke!

    – Benutzer2649496

    9. August 2013 um 17:54 Uhr

1646311147 567 CSS Zeilenabstand von Text reduzieren
Schiwam

Addieren display:block & Löschen height.

<span style="font-size: 75%; line-height: 16px; display:block">blog posts & occasional updates (updates max 1 every 14 days)</span>

Sie erfahren mehr über display:block Eigentum Hier.

  • Sie sollten ihm wahrscheinlich erklären, warum das Hinzufügen von Anzeigeblöcken bei der Spanne hilft. Das würde Ihre Antwort definitiv viel nützlicher machen. Ich hoffe, Sie haben nichts dagegen, dass ich vorschlage.

    – schwefelhaltig

    9. August 2013 um 16:15 Uhr

  • Und Sie sollten nicht setzen display:block auf einer Spanne. Es dient keinem nützlichen Zweck, und ich klassifiziere dies als Elementmissbrauch. Verwandeln Sie es stattdessen in ein div.

    – Herr Lister

    9. August 2013 um 16:27 Uhr

  • Danke! Wie sich herausstellte, funktionierte es gut, wenn man es in ein

    umwandelte.

    – Benutzer2649496

    9. August 2013 um 17:55 Uhr

  • @ user2649496 Sie sind ein Tag Savoir, indem Sie <div> + line-hieght:1 !important mein Problem gelöst. Ich habe meinen Text in verwendet <b> Tag funktionierte aber nicht, also danke

    – PatsonLeaner

    31. Oktober 2019 um 11:41 Uhr

Du hast ein line-height: 21px;
Im Körper. Entfernen Sie diese, und es sollte funktionieren.

  • Ich kann die Zeilenhöhe im Körper nicht entfernen, da sie für so viele andere Elemente gilt. Ich muss es für diesen Text überschreiben … aber danke!

    – Benutzer2649496

    9. August 2013 um 17:52 Uhr

  • Ich habe es in Webdev getestet und es hat gut funktioniert, aber ich bin froh, dass Sie es trotzdem behoben haben.

    – Beneh

    9. August 2013 um 20:12 Uhr

923460cookie-checkCSS: Zeilenabstand von Text reduzieren?

This website is using cookies to improve the user-friendliness. You agree by using the website further.

Privacy policy