css - Issue with font rendering in browser -

result sample: font rendering issue sample

as can see 2 letters "f" , "l" bold in every browsers , styles.css doesn't have rules it. i'm not sure, think due problem font's rendering ("helveticaneuew01-45ligh, helvetica neue,helvetica,sans-serif").

i tried use "text-rendering: optimizelegibility" property, doesn't seem help.

<p style="text-rendering: optimizelegibility;">far far away, behind word mountains, far countries vokalia , consonantia, there live the&nbsp;blind texts. separated live in bookmarksgrove right @ coast of semantics, large language&nbsp;ocean. small river named duden flows. separated live in bookmarksgrove right @ coast of&nbsp;the semantics.</p> 

and styles:

element {     text-rendering: optimizelegibility; } body.home .entry-content p {     margin: 20px 0px;     font-family: "helveticaneuew01-45ligh",helvetica neue,helvetica,sans-serif;     font-weight: normal;     font-style: normal;     font-size: 1.9em; } body.home .entry-content p {     margin: 20px 0px;     font-family: "helveticaneuew01-45ligh",helvetica neue,helvetica,sans-serif;     font-weight: normal;     font-style: normal;     font-size: 1.9em; } body.page-template-default .entry-content p {     font-size: 1.6em;     line-height: 1.5;     margin-bottom: 15px; } .entry-content p {     font-size: 1.6em;     line-height: 1.7; } .entry-content p {     margin: 0px 0px 15px;     font-size: 1.6em;     line-height: 1.7; } p {     margin-bottom: 1.5em; } body, button, input, select, textarea {     color: #404040;     font-family: "helveticaneuew01-55roma",helvetica neue,helvetica,sans-serif;     font-weight: normal;     font-style: normal;     line-height: 1.5; } 

what can improve how font being rendered?

text-redering / ligatures

you've mentioned you've tried following css attribute.

text-rendering: optimizelegibility; 

there may few more things consider, article "make web pages more legible ligatures":

"to turn on standard ligatures, use:"

     p { font-variant-ligatures: common-ligatures; } 

"to gain support in browsers, while using text-rendering: optimizelegibility fallback":

p {     /* optional: older browsers */     text-rendering: optimizelegibility;        /* ios , safari 6 */     -webkit-font-variant-ligatures: common-ligatures;      /* up-to-date browsers, including ie10 , opera 21 */      font-variant-ligatures: common-ligatures;  } 

recommended article:

• css-tricks: text-rendering

---

font-smoothing

another way improve font appearance:

-webkit-font-smoothing: antialiased; // chrome - safari -moz-osx-font-smoothing: grayscale; // mozilla 

two recommended articles:

• font smoothing explained
• font smoothing in webkit , firefox