у меня всё сохраняется и выводится, но css не применяется. почему и как эту проблему решить?

html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width">
    <title>Document</title>
</head>
<body>
    <button onclick="fuf()">кликЕР</button>
    <div class="body"></div>
    <script src="code.js"></script>
</body>
</html>

css

.gfd {
    height: 20px;
    width: 20px;
    background-color: rgba(15, 136, 26, 0.719);
}

js

let ghj = document.querySelector('.body');
function fuf() {
  ghj.innerHTML += '<main class="gfd">mv</main>';
  localStorage.setItem('key', document.querySelector('.body').innerHTML);
}
ghj.innerHTML += localStorage.getItem('key');

Ответы (2 шт):

Автор решения: Deprom

Вы не подключили файл <link rel="stylesheet" href="myfile.css"> Подключите это в теге <head></head>

→ Ссылка
Автор решения: Qwertiy

А с какой стати ему применяться, если он даже на страницу не подключен?

→ Ссылка