Kreis um fa Icon

    Hallo Leute

    ich möchte in weißes fa icon (fa-wrench) um dass ein gefüllter Kreis ist.
    Wie kann ich das in CSS realisieren?

    Es soll in dieser Art aussehen :

    LG
    Sabbel

    • Gerade eben
    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren

    http://mark-dot-net.blogspot.de/2014/10/how-to…rounds-for.html

    WordPress ist "frei" wie in Freiheit es zu nutzen, aber nicht im Sinne von Freibier. Wer also glaubt man bekommt rund um WordPress alles kostenlos, der irrt. Hilfe ist ein Geschenk für das man sich bedankt, dafür gibt es den 'Gefällt mir' Button. Wer das nicht kann und sich selbst nicht zu helfen weiss, muss sich bezahlte Unterstützung suchen.

    Cool .. danke ...

    habe die zweit variante genutzt.
    Aber das icon ist grau .. wie kann ich die farbe in weiss ändern?
    html:
    <p><span class="fa-stack fa-4x"><br /> <i class="fa fa-circle fa-stack-2x icon-background"></i><br /> <i class="fa fa-wrench fa-stack-1x"></i><br /> </span></p>
    css:
    .icon-background {
    color: #402000;
    }

    LG
    Sabbel

    Link zur Seite bitte

    WordPress ist "frei" wie in Freiheit es zu nutzen, aber nicht im Sinne von Freibier. Wer also glaubt man bekommt rund um WordPress alles kostenlos, der irrt. Hilfe ist ein Geschenk für das man sich bedankt, dafür gibt es den 'Gefällt mir' Button. Wer das nicht kann und sich selbst nicht zu helfen weiss, muss sich bezahlte Unterstützung suchen.

    Code
    i.fa.fa-stack-1x {
  color: #fff;
}

    WordPress ist "frei" wie in Freiheit es zu nutzen, aber nicht im Sinne von Freibier. Wer also glaubt man bekommt rund um WordPress alles kostenlos, der irrt. Hilfe ist ein Geschenk für das man sich bedankt, dafür gibt es den 'Gefällt mir' Button. Wer das nicht kann und sich selbst nicht zu helfen weiss, muss sich bezahlte Unterstützung suchen.

    Vielen Dank für die Hilfe.

    Ich habe folgendes umgesetzt :

    HTML
    <div class="icon_bild">
<span class="fa-stack fa-4x">
  <i class="fa fa-circle fa-stack-2x icon-background"></i>
  <i class="fa fa-wrench fa-stack-1x"></i>
</span>
</div>
<div class="icon_text">
<h1>Überschrift</h1>
<p>Inhalt Text über mehrere Zeilen</p></div>
    Code
    i.fa.fa-stack-1x {color: #fff;}
.icon_bild{width: 20%;float:left;}
.icon_text{width: 80%;float:left;}

    Kann mir jemand Helfen ?

    Es soll so sein, dass es ohne die beiden definierten Div Container umgesetzt wird.
    Dass heisst dass das Icon mit before vor den gesammten Text kommt.

    Wenn ich es verusche erhalte ich immer nur einen Rahmen um das Bild.

    LG

    Sabbel

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!

Benutzerkonto erstellen Anmelden