Jump to content

Markdown fonts changing in different browsers

Recommended Posts

Site URL: https://peripheralviewmedia.com

I have created a couple markdowns to change font color within a single sentence. The fonts are changing to a more Times Roman font in Safari.

See attached screen shots for the font variations.

My markdown code is the following: 
<div style="text-align:center; font-size:1.75em"> We are your <span style="color:#FF4500; font-family:Myriad Pro; font-size:1.0em;">content creators</span>, <span style="color:#FF4500; font-family:Myriad Pro; font-size:1.0em;">strategy stewards</span>  and <span style="color:#FF4500; font-family:Myriad Pro; font-size:1.0em;">connection curators</span>— all in one turnkey storytelling bundle.<p></p></div>

I am using the Brine 7.0 template. 

Thanks for your help.

Screen Shot 2020-11-29 at 1.20.47 PM.png

Screen Shot 2020-11-29 at 1.20.32 PM.png

Edited by jenartsquare
Link to comment

Use the following HTML.

<div data-preserve-html-node="true" style="text-align:center; font-size:1.75em">
  We are your
  <span data-preserve-html-node="true" style="color:#FF4500; font-size:1.0em;">
    content creators
  <span data-preserve-html-node="true" style="color:#FF4500; font-size:1.0em;">
    strategy stewards
  <span data-preserve-html-node="true" style="color:#FF4500; font-size:1.0em;">
    connection curators
  all within one turnkey storytelling bundle.
  <p data-preserve-html-node="true">

The issue was using font-family:Myriad Pro; The font family for that font is myriad-pro. In this location you don't need to redefine the font so I removed it.

Let us know how it goes.

Find my contributions useful? Please like, upvote, mark my answer as best , and see my profile. Thanks for your support!

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.