Issue
From my understanding, all Font Awesome icons should work with linking this bootstrap stylesheet. But, I just got that one .fa fa-deskto to work, others do not display, the second one for example is: https://fontawesome.com/icons/bath?f=classic&s=solid
Both icons are also free, but it isn't working.
<head>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
</head>
<body>
<div>
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet" />
<div className="icon">
<i class="fa fa-desktop"></i>
<i class="fa-solid fa-bath"></i>
</div>
</div>
</body>Solution
Because the provided link does not have the styles for fa-bath it must have been added in a later version, please find below link with the latest version where it works fine!
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>HTML + CSS</title>
<link rel="stylesheet" href="styles.css" />
</head>
<body>
<div>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" integrity="sha512-DTOQO9RWCH3ppGqcWaEA1BIZOC6xxalwEsw9c2QQeAIftl+Vegovlnee1c9QX4TctnWMn13TZye+giMm8e2LwA==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<div className="icon">
<i class="fa fa-desktop"></i>
<i class="fa-solid fa-bath"></i>
</div>
</div>
</body>
</html>Answered By - Naren Murali
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.