doutan2111
doutan2111
2016-12-06 15:26

Roboto字体下延器在Safari中无法正确呈现

已采纳

I'm making my first steps learning to code. I have been taking some courses on Internet and now I'm developing a Wordpress child theme so I can continue learning from the practice.

The thing is that I'm using a Google font called Roboto. It works perfectly on Google Chrome but when I use Safari the descenders of my characters doesn't render correctly. This is an example for the "g" and the "j":

enter image description here

You can find the link here:http://mmparis.com/SMtestsite/paintings/beijing/

I uploaded this font using the functions.php file:

function wpb_add_google_fonts() {

wp_enqueue_style( 'wpb-google-fonts', 'https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i', false ); 
}

add_action( 'wp_enqueue_scripts', 'wpb_add_google_fonts' );

I've been looking for a lot of tutorials and posts here but I can't find the reason or the solution. Do you have some suggestion?

Thank you

  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 复制链接分享
  • 邀请回答

1条回答

  • doucuo1642 doucuo1642 5年前

    I had a quick inspect in Chrome on Windows and it looks like some of the padding is sitting over the bottom of the text.

    enter image description here

    Try adding height:30px; to .menu-toggle and see if that works. It should stop the padding sitting on it.

    .menu-toggle {
        height: 30px;
    }
    
    点赞 评论 复制链接分享

相关推荐