ligatures

Simple text with and without ligatures.

Repository files

PDF files

Converter Status PDF Preview
PDFreactor  ERROR
does not support ligatures in version 10
PrinceXML  OK
Antennahouse  OK
Weasyprint  (OK)
unable to disable ligatures
PagedJS  (OK)
unable to disable ligatures
Typeset.sh  (OK)
unable to disable ligatures

HTML input

<html>
    <head>
        <link rel="stylesheet" type="text/css" href="styles.css" />
    </head>
    <body>

        <div class="demo with-ligatures">
            <h1> With ligatures</h1>
            <div> fliegen</div>
            <div> Paulus</div>
            <div> finden</div>
            <div> ff</div>
            <div> fj</div>
            <div> Fl</div>
            <div> Fi</div>
            <div> To</div>
        </div>

        <div class="demo without-ligatures">
            <h1> Without ligatures</h1>
            <div> fliegen</div>
            <div> Paulus</div>
            <div> finden</div>
            <div> ff</div>
            <div> fj</div>
            <div> Fl</div>
            <div> Fi</div>
            <div> To</div>
        </div>

        <div class="demo serif with-ligatures">
            <h1> With ligatures</h1>
            <div> fliegen</div>
            <div> Paulus</div>
            <div> finden</div>
            <div> ff</div>
            <div> fj</div>
            <div> Fl</div>
            <div> Fi</div>
            <div> To</div>
        </div>

        <div class="demo serif without-ligatures">
            <h1> Without ligatures</h1>
            <div> fliegen</div>
            <div> Paulus</div>
            <div> finden</div>
            <div> ff</div>
            <div> fj</div>
            <div> Fl</div>
            <div> Fi</div>
            <div> To</div>
        </div>

    </body>
</html>

Stylesheet

@import url("../styles/a5.css");

h1 {
    font-size: 15pt;
    color: red;
    margin-bottom: 1em;
}

div.demo {
    margin-bottom: 1em;
    font-size: 18pt;
    float: left;
    width: 45%;
    min-width: 45%;
    font-kerning: none;
}

.with-ligatures {
    font-variant-ligatures: normal;
    -ah-ligature-mode: auto;
    -webkit-font-kerning: auto;
    font-kerning: none;
}


.without-ligatures {
    font-variant-ligatures: none;
    -ah-ligature-mode: none;
    font-variant-ligatures: none;
}

.serif {
    font-family: Times;
}