XF 1.2 Insert icon via CSS

[tommydamic68]

I want to put this chat icon on the right side of the 'start a conversation" in line with the wording. Can i do this via CSS as apposed to HTML? if so, how? I cannot get it to appear inline with HTML.

<xen:if is="{$canStartConversation}">
                                <dl><dd><a href="{xen:link 'conversations/add', '', 'to={$user.username}'}">{xen:phrase start_conversation}</a></dd></dl>
                            </xen:if>&nbsp;<IMG SRC="http://www.mysite.com/community/styles/images/images/chat1.png" ALT="Convo" WIDTH=20 HEIGHT=20>

 

[mistypants]

Add a custom class to it, like so (you can make it whatever you want):

<a class="convo-icon" href="{xen:link 'conversations/add', '', 'to={$user.username}'}">{xen:phrase start_conversation}</a>

Then use a pseudo class:

.convo-icon:after { content: url(pathtoyour/image.png); }

And you can adjust it from there. Should work, haven't tested it.

 

[tommydamic68]

No - did not work. Conversation link didn't even appear . Any other thoughts?

 

[EQnoble]

If you gimme a link I will take a look.

 

[tommydamic68]

Sorry @mistypants - it did work, thank you! just had to add:

margin-left: 5px;