Prerequisite: Follow steps 1, 2 and 3 in my previous post.
In my previous article I showed how Elegant font icons can be inserted in HTML. They can also be inserted before or after an element using CSS.
For example, below is the CSS to display the gift icon to the left of widget title:
#text-4 h4.widget-title:before {
content: "\e008";
font-family: 'ElegantIcons';
padding-right: 0.5em;
speak: none;
}
where #text-4 h4.widget-title is the selector to target a specific widget’s title, which can be written using a tool like Firebug.
The possible values of content for various icons can be obtained from elegant_font/HTML CSS/style.css.
