Long_distance_man
New member
Greetings.
I am learning HTML and CSS.
One thing that hasn't worked for me at all is ligatures in text. I have tried many examples from many tutorials, but none of the settings work to give ligatures.
My setup is Windows 10, Chrome, and Edge. I have also tried on a Windows 11 PC with no success.
Here is an example of some sample code from website https://www.w3docs.com/learn-css/css-font-variant-ligatures-property.html
The website shows results that give the ligatures as desired, but on my computer it is individual letters. I attach two scans to illustreate.
<!DOCTYPE html>
<html>
<head>
<title>The title of the document </title>
<style>
div {
font-family: Lora, serif;
font-size: 35vw;
}
.gray {
font-variant-ligatures: no-common-ligatures;
color: #ccc;
}
.blue {
font-variant-ligatures: common-ligatures;
color: #1c87c9;
}
</style>
</head>
<body>
<h2>Font-variant-ligatures property example</h2>
<div>
<span class="gray">fi</span>
<span class="blue">fi</span>
</div>
</body>
</html>
Suggestions and help appreciated.
I am learning HTML and CSS.
One thing that hasn't worked for me at all is ligatures in text. I have tried many examples from many tutorials, but none of the settings work to give ligatures.
My setup is Windows 10, Chrome, and Edge. I have also tried on a Windows 11 PC with no success.
Here is an example of some sample code from website https://www.w3docs.com/learn-css/css-font-variant-ligatures-property.html
The website shows results that give the ligatures as desired, but on my computer it is individual letters. I attach two scans to illustreate.
<!DOCTYPE html>
<html>
<head>
<title>The title of the document </title>
<style>
div {
font-family: Lora, serif;
font-size: 35vw;
}
.gray {
font-variant-ligatures: no-common-ligatures;
color: #ccc;
}
.blue {
font-variant-ligatures: common-ligatures;
color: #1c87c9;
}
</style>
</head>
<body>
<h2>Font-variant-ligatures property example</h2>
<div>
<span class="gray">fi</span>
<span class="blue">fi</span>
</div>
</body>
</html>
Suggestions and help appreciated.
