PDF-icon auf Schriftunterkante angleichen!?

Thema wurde von Anonymous, 16. Januar 2020 erstellt.

  1. Anonymous

    Anonymous Beta-Held

    Registriert seit:
    6. September 2011
    Beiträge:
    1.921
    Danke erhalten:
    456
    Danke vergeben:
    438
    #1 Anonymous, 16. Januar 2020
    Zuletzt bearbeitet: 16. Januar 2020
    Hallo Gemeinde,
    hatte vor einiger Zeit folgenden Code eingebaut:
    Code:
    .nav-tabs > li > a[title=Katalog] {
        background:url(/images/logo-pdf.png) no-repeat;
        background-size: 25px;
        padding-left: 25px;
    }
    Nun ist es aber Optisch nicht so schön das das Icon nicht auf gleicher Höhe ie die Schrift ist!
    Jemand eine Idee für mich?
    pdf-icon_tiefer.JPG
     
  2. barbara

    barbara G-WARD 2014-2020

    Registriert seit:
    14. August 2011
    Beiträge:
    35.352
    Danke erhalten:
    11.198
    Danke vergeben:
    1.601
    Warum nimmst Du ein großes Bild (Ladezeit) und nicht ein FontAwesom - Schriftzeichen?
     
  3. Anonymous

    Anonymous Beta-Held

    Registriert seit:
    6. September 2011
    Beiträge:
    1.921
    Danke erhalten:
    456
    Danke vergeben:
    438
    Wie müsste ich das umsetzen?
     
  4. barbara

    barbara G-WARD 2014-2020

    Registriert seit:
    14. August 2011
    Beiträge:
    35.352
    Danke erhalten:
    11.198
    Danke vergeben:
    1.601
    Ändere das css mal so ab:
    Code:
    .nav-tabs > li > a[title=Katalog]:before {
      font-family: "Font Awesome 5 Free";
      content: "\f1c1";
      color: red;
    }
    Wenn du das Zeichen etwas größer haben möchtest, fügst Du die Zeile
    font-size: 25px;
    dazu
    Mit der PX-Zahl musst du ein bisschen testen, bis es passt :)
     
  5. Andreas Siebold

    Andreas Siebold Erfahrener Benutzer

    Registriert seit:
    12. März 2019
    Beiträge:
    293
    Danke erhalten:
    47
    Danke vergeben:
    79
    Testweise mal das "padding-left: 25px" durch "padding: 10px 10px 10px 25px" (oben rechts unten links) ersetzen?
     
  6. Anonymous

    Anonymous Beta-Held

    Registriert seit:
    6. September 2011
    Beiträge:
    1.921
    Danke erhalten:
    456
    Danke vergeben:
    438
  7. Manni_HB

    Manni_HB G-WARD 2012/13/14/15

    Registriert seit:
    26. April 2011
    Beiträge:
    9.098
    Danke erhalten:
    1.540
    Danke vergeben:
    909
    Ort:
    Bremen
    Oft hilft auch: "vertical-align: sub;"