Search code examples
htmlpdfbrowser

HTML saving to PDF loses anchor tags


I created an HTML page with a my own styles. I also customized bootstrap to remove the print media styles on my downloads. Yet I still lose anchor tags in the PDF that is saved, as if the href attribute doesn't exist, there are no links to follow. I tried to save the HTML to PDF in Chrome, Firefox and Opera all didn't work.

Any suggestions are very much appreciated.

EDIT Here is part of the code.

<html lang="en">

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

    <link rel="stylesheet" href="cv-style.css" type="text/css" media="all"/>
   
    <link rel="stylesheet" href="assets/libs/bootstrap-no-print-media/css/bootstrap.min.css"
          media="all">
    <link rel="stylesheet" href="assets/libs/font-awesome-4.6.3/css/font-awesome.min.css" media="all">

</head>

<body class="container">
<header id="name">
    <h1 id="my-name">Sime Habtu</h1>
    <article>
        <div id="online">            
            <a href="http://stackoverflow.com/users/3597111/sime" target="rss"><i class="fa fa-stack-overflow fa-lg"></i></a>            
        </div>
    </article>
</header>
</body>

So here when I save the outcome of this code to PDF I get the style and content but the links are not there. The stackoverflow icon here won't print with the embedded link.


Solution

  • I finally figured out why the links were not working. Hopefully someone will find this helpful. It turns out the problem was caused by the google fonts that was added using the @import in the CSS. When the google fonts were used by linking them in the HTML file the anchor tags were working on the converted PDF file.