Printable Version of Topic

Click here to view this topic in its original format

HTMLHelp Forums _ Markup (HTML, XHTML, XML) _ Spacing for social media icons

Posted by: cjk777 May 7 2019, 04:45 AM

I have some code that displays an icon followed by the description (Linkedin, facebook etc), but the text is touching the icon with no spacing. How can a space be added between the icon and the text?


<li><a class="linkedin" title="" href="https://http://www.linkedin.com/company/chemeyes" target="_blank" rel="noopener noreferrer"><i class="fa fa-linkedin" aria-hidden="true"></i><span class="ftc-tooltip social-tooltip">Linkedin</span></a></li>
<li></li>
</ul>
</div>
</div>

Thanks in advance!

Posted by: Christian J May 7 2019, 05:02 AM

The HTML above doesn't create any text or icons by itself, probably these are inserted with javascript and CSS.

You might add spacing to the HTML using CSS padding or margin, or maybe add a space character in the text, but it's hard to advice without seeing the complete code.

Try using your browser's developer tools to view the complete code of the above snippet (after the icon and text has been added), and post it here.

Posted by: cjk777 May 7 2019, 05:19 AM

QUOTE(Christian J @ May 7 2019, 05:02 AM) *

The HTML above doesn't create any text or icons by itself, probably these are inserted with javascript and CSS.

You might add spacing to the HTML using CSS padding or margin, or maybe add a space character in the text, but it's hard to advice without seeing the complete code.

Try using your browser's developer tools to view the complete code of the above snippet (after the icon and text has been added), and post it here.


Great, I'll try that, thanks!

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)