Q&A
ありがとうございます！
お世話になっております。
現在模写コーディング中なのですがfont-awesomeが文字化けしてしまいます。
ネットで調べてみて、faをfasにしたり、fas-にしてみたり、
font-weightを400や900にいじったりしましたが上手くいきませんでした。
head内のCDN？も確かめてみましたが問題ないように感じました。
何が問題なのでしょうか？
ご教授いただけると幸いです。よろしくお願いいたします。
<head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <link href="https://use.fontawesome.com/releases/v5.6.1/css/all.css" rel="stylesheet"> <link rel="stylesheet" href="css/styles.css"> <link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link href="https://fonts.googleapis.com/css2?family=Lato:wght@700&display=swap" rel="stylesheet"> <title>progate</title> </head>
HTML <div class="sns"> <i class="fa-brands fa-twitter"></i> <i class="fa-brands fa-facebook"></i> </div> CSS .sns{ font-family:"Font Awesome 5 Free" color:#2b546a; } なぜか斜めになってしまいます  謎の領域 padding margin、両方試しましたが消えませんでした。 
回答2件
0
ベストアンサー
おそらく対象フォントが含まれていないのではないかと思います。
下記を追加して試してもらえますか？
html
1 <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.1/css/all.min.css" rel="stylesheet"> 2 3 <div class="sns"> 4 <i class="fa-brands fa-twitter"></i> 5 <i class="fa-brands fa-facebook"></i> 6 </div>
投稿2022/04/27 16:18
編集2022/04/29 07:01
総合スコア4633
0
CSS
1.sns{ 2 font-family:"Font Awesome 5 Free"; /* ← セミコロン抜け*/ 3 color:#2b546a; 4}
投稿2022/04/27 16:02
総合スコア69407
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2022/04/29 03:53
2022/04/29 04:09 編集
2022/04/29 06:59
2022/04/29 09:39 編集
2022/05/05 12:35
2022/05/05 13:54
2022/05/05 13:57