|
|||
fa icon von Text umfließen lassen
Hallo,
ich möchte ein Bild durch ein Every Font Awesome 4.5.0 Icon ersetzen Dabei soll der Text um das icon umflossen werden. So sieht es mit einem Bild aus Und so mit dem Icon Was muss ich machen dass es wieder so umflossen ist wie beim Bild? Code:
.icon_schraubschluessel p:before{content: "\f0ad"; font-size:50px;padding-right: 10px; font-family: FontAwesome; .fa-icon();} HTML-Code:
<div class="icon_schraubschluessel"> <p>Bei uns gibt es keine überteuerten Pauschalen. ....... </p></div> |
Sponsored Links |
|
|||
Hallo
Zitat:
Die Pseudoelemente ::after und ::before befinden sich immer innerhalb ihres Elternelements vor oder hinter dessen Inhalt und können dieses nicht verlassen. Das könnte dann zum Beispiel so aussehen: Code:
<!DOCTYPE html> <html lang="de"> <head> <meta charset="utf-8"> <title>FontAwesome 01</title> <meta name="description" content="HTML5, CSS3, FontAwesome"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <style> @import url(http://fortawesome.github.io/Font-Awesome/assets/font-awesome/css/font-awesome.css); /* Clearfix - Micro-Clearfix-Hack */ @media all { .cf::before, .cf::after { content: " "; /*Leerstelle ist wichtig*/ display: table; } .cf::after { clear: both; } } @media all { * { box-sizing: border-box; } html { font-family: sans-serif; font-size: 120%; line-height: 1.3; } body { width: 96%; margin: 1rem auto; } .fa { font-size: 4rem; margin-right: 1rem; margin-bottom: 1rem; float: left; } } </style> </head> <body> <h1>Autobahnwahn</h1> <p class="cf"><span class="fa fa-wrench"></span>Seit zwei Jahren ist meine Arbeit in Düsseldorf. Meine Familie lebt dagegen in Hamburg. Und dazwischen ich, aber ganz cool. Vollbremskombination aus Ampel oder Einfädeln oder beides auf einmal. Geht nur mit Tricks. Eben noch kurz auf die A 52. Schon vielversprechend lebhaft. Hinter dem Breitscheider Kreuz geht es richtig los. Stau auf der A 3 bis Oberhausen. Danach entspannt es sich auch nur deshalb, weil enge Baustellen mit rüden Geschwindigkeitsbegrenzungen zum gleichmässigen Rollen zwingen. Es wird links überholt, es wird rechts überholt. Es wird gar nichts mehr, alles steht und macht lange Gesichter. Ich dagegen wechsle die Cassette. Es geht weiter. Vor und hinter mir hektische Spurenwechsel. So zieht sich das Stück A 2 bis zum Recklinghauser Kreuz. Der erhofften Entspannung folgt zuverlässig der Vollfrust. Die A 43 bis Münster ist genauso voll wie das Kamener Kreuz zur Rush-hour. Auf der A 1 ist dann endgültig Schluss mit lustig. Alles dümpelt auf der Überholspur. Natürlich mit 90. Rechts geht es schneller, irrerweise wegen der Lkws. Die wollen nämlich alle noch vor zehn zu Hause sein.</p> </body> </html> MrMurphy Geändert von MrMurphy (20.03.2016 um 02:52 Uhr) |
Sponsored Links |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Wrapper wächst nicht mit, keine Floats | maclady | CSS | 11 | 10.02.2010 18:30 |
Wachsende Container | Andy CD | CSS | 13 | 10.02.2010 14:08 |
DIV bis GANZ unten | burnZ | CSS | 5 | 27.07.2008 14:14 |
Helft mir. Ich habe voll die Leseschwäche | nick | CSS | 12 | 15.01.2008 21:52 |
Problem mit div und Höhe | deep4 | CSS | 2 | 13.11.2007 21:03 |