按钮文字在手机上旋转

我创建了浮回到顶部按钮。在PC上，一切都很好，但是在移动时，按钮内部的文本旋转了一点，花了一些时间来加载它。什么会导致这种情况？按钮文字在手机上旋转

这是按钮使用materializecss：

<a class="back-to-top btn-floating btn-large waves-effect waves-light green"> 
    <i class="material-icons">↑</i> 
</a>

这是CSS：

a.back-to-top { 
    display: none; 
    width: 60px; 
    height: 60px; 
    position: fixed; 
    right: 20px; 
    bottom: 20px; 
}

而且此功能对顶部滚动：

var amountScrolled = 300; 

$(window).scroll(function() { 
    if ($(window).scrollTop() > amountScrolled) { 
     $('a.back-to-top').fadeIn('slow'); 
    } else { 
     $('a.back-to-top').fadeOut('slow'); 
    } 
}); 
$('a.back-to-top').click(function() { 
    $('html, body').animate({ 
     scrollTop: 0 
    }, 700); 
    return false; 
});

在PC：

移动：

编辑：只是，如果你想看到自己this是演示

来源

2016-11-28 Tarvo Mäesepp

2首先做检查：你是否清空浏览器的缓存来测试它？控制台说什么？那么，如果有必要，你有一个活的链接提供，所以我可以看到它？ ;） –

字体未加载？ – ray

@LouysPatriceBessette我添加了演示链接:) –

检查font-style: italic;或transform:skew(...)

是的，这是从font-style: italic;元素<i>继承。

你穿上

i.material-icons { font-style:normal; }

打压倾斜。

来源

2016-11-28 23:30:39

在其余的CSS我想...可以。但那么，为什么只能在手机上？在@media规则中，我会检查。 ;） –

你的速度令人印象深刻。 ;）+1 –

Woww ..它做到了。谢谢。但是为什么按钮出现后出现按钮内的标签？ –

按钮文字在手机上旋转

回答

相关问题