Displaying bar codes with custom font

StackOverflow https://stackoverflow.com/questions/21167237

  •  28-09-2022
  •  | 
  •  

Question

I have the font to convert the numbers to bar code. It is not happening for me in IE 11, FF 26 on my Win 7 machine. Please note that this page is part of intranet app and behind windows login.

CSS:

@font-face {
    font-family: 'AdvC39b';
    src: url('fonts/ADVC39B.TTF');
    src: url('fonts/ADVC39B.TTF') format('truetype');
    /*
    font-weight: normal;
    font-style: normal;
    */
}

.displayBarCode { font-family: AdvC39b; font-size: 16px; }

Html (extra content removed):

<!DOCTYPE html>
<html>
<head id="Head2" runat="server">
    <title></title>
    <META HTTP-EQUIV="CACHE-CONTROL" CONTENT="NO-CACHE">
    <META HTTP-EQUIV="PRAGMA" CONTENT="NO-CACHE">
    <link href="Labels.css?v=1.0" rel="stylesheet" type="text/css" />
</head>
<body>
    <form id="form2" runat="server">


                    <asp:DataGrid ID="hsGrid" runat="server" DataKeyField="HS_ID" AllowPaging="False" AutoGenerateColumns="False" Visible="False" BorderStyle="none" GridLines="none" ShowHeader="False" ShowFooter="false">
                        <ItemStyle HorizontalAlign="left"></ItemStyle>
                        <Columns>
                            <asp:TemplateColumn>
                                <ItemTemplate>
                                    <div class="printContainerDiv">

                                        <asp:Label ID="lblBarcodeEVID"  CssClass="displayBarCode" runat="server" Text='<%# "*" + DataBinder.Eval(Container.DataItem, "evid") + "*" %>'></asp:Label>&nbsp;

                                    </div>
                                </ItemTemplate>
                            </asp:TemplateColumn>
                        </Columns>
                    </asp:DataGrid>



    </form>
</body>
</html>

Image attached..enter image description here

Was it helpful?

Solution

you need to add the font in all format eot, ttf, woff, svg

try using a service like icomoon

EDIT:

i use this CSS to declare custom fonts and it works in all browsers 

@font-face{
    font-family: "Font Name";
    src:url("fonts/font-name.eot?#iefix");
    src:url("fonts/font-name.eot?#iefix") format("eot"),
        url("fonts/font-name.woff") format("woff"),
        url("fonts/font-name.ttf") format("truetype"),
        url("fonts/font-name.svg") format("svg");
}
Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top