I am trying to make the Home link in the breadcrumb an icon instead of text. I am doing the normal text-indent way of hiding the text, but for whatever reason the text will not disappear. I have moved the code around to different tags and still it will not hide the text. Any thoughts on what the issue would be and how to fix it?

my current code for the tag:

ol#crumbs li.crumb.crumb-first a {
    text-indent: 100%;
    overflow: hidden;
    white-space: nowrap;
}

Comments

ryanfc78 created an issue. See original summary.

ryanfc78’s picture

ryanfc78 CreditAttribution: ryanfc78 commented
Issue summary: View changes
silvi.addweb’s picture

silvi.addweb CreditAttribution: silvi.addweb at AddWeb Solution Pvt. Ltd. commented

You can hiding text using two ways:

1. Hiding the text using text-indent as following:

ol#crumbs li.crumb.crumb-first a {
            text-indent: 100%;
            white-space: nowrap;
        }

2. Hiding the text using font-size as following:

  ol#crumbs li.crumb.crumb-first a {
            font-size:0;
        }

I hope this helps you.

Thanks!