CSS space margin and font help with Pique theme

• 

  calowensound · Member · Oct 25, 2016 at 2:40 am

  • Copy link
  • Add topic to favorites

  Hey CSS wizards.

  I’m using the theme Pique on my site – calowenmusic.com, and I’m pretty happy with how it all runs, however 2 little nagging things I’d like help with are:

  1. Reducing the space between the top menu and the logo / reducing the space between titles and text

  2. when the page first loads, the font quickly changes from a larger Times New Roman style to the more favourable Noto Sans. I’d like to remove that little jump so it doesn’t briefly display in the times style.

  Any help would be greatly appreciated, thanks :)

  The blog I need help with is: (visible only to logged in users)

• 

  thesacredpath · Member · Oct 27, 2016 at 5:25 am

  • Copy link

  Hi there,

  1. Reducing the space between the top menu and the logo / reducing the space between titles and text

  Give this a try. Originally it was 227.4px. You can adjust as desired.

  #pique-hero .pique-panel-content {
      padding-top: 100px !important;
  }

  2. when the page first loads, the font quickly changes from a larger Times New Roman style to the more favourable Noto Sans. I’d like to remove that little jump so it doesn’t briefly display in the times style.

  This is one of the problems with web-based fonts, such as the custom fonts in the Customizer. Sometimes the servers can be slow, and the browser will send out a request for the font from the font server. If the server is slow, or the internet connection is slow, the browser will typically wait until it gets the font before it starts to render the page. If the delay is too long, visitors may click away and think there is something wrong with the site. To keep that from happening, the choice was made to instruct the browser to start loading the page content and then switch the font once it gets it from the font server (Google or Typekit). This is something that we are aware of and are on the lookout for ways to alleviate this delay, but as of right now, there is no solution. We are sort of at the mercy of the font sites/servers.