ロゴの表示がおかしくなる

前提・実現したいこと

background-imageでロゴを表示させたいのですが、表示が上半分しか出ないという変な表示になります。
参考サイトのcssを参考に記入したのですが、原因がわからず困っています。

検証モードで確認したところFailed to load resource: the server responded with a status of 404 (Not Found)とエラーが発生しているのですが、関係があるのでしょうか？
よろしくおねがいします。

リセットcssはこちらを使用しており、reset.cssの別ファイルとして読み込んでいます。
https://github.com/nicolas-cusan/destyle.css/blob/master/destyle.css

該当のソースコード

html
1  <!doctype html>
2<html>
3<head>
4<meta charset="UTF-8">
5<title>大学のサイト</title>
6
7<link rel="stylesheet" href="css/reset.css">
8<link rel="stylesheet" href="css/index.css">
9  
10</head>
11
12<body>
13<header id="header" class="header">
14  <h1 class="header-logo">
15    <a href="/" class="header-logo-link logo"></a>
16  </h1>
17  <div id="header-search" class="header-search"></div>
18  <div id="search" class="search"></div> 
19  <div id="header-toggle" class="header-toggle"></div>
20  <div id="header-nav" class="header-nav"></div>
21  <div id="header-back" class="header-back"></div>
22</header>
23<main>
24  <div class="main-img"></div>
25</main>
26</body>
27</html>
28

css
1.header {
2  background: rgba(229, 231, 237, 0.9);
3  border-bottom: none;
4  position: fixed;
5  left: 0;
6  right: 0;
7  top: 0;
8  z-index: 10;
9  height: 85px;
10  -webkit-transition: background 0.4s;
11  -o-transition: background 0.4s;
12  transition: backgrond 0.4s;
13  display: -webkit-box;
14  -webkit-box-align: center;
15  align-items: center;
16}
17.header-logo {
18  margin-left: 0;
19  padding: 15px;
20}
21.header-logo-link {
22  background-image: url("../tohoku.logo.svg");
23  width: 150px;
24  height: 36px;
25}
26.logo {
27  display: inline-block;
28  background-repeat: no-repeat;
29  background-size: cover;
30  vertical-align: top;
31  white-space: nowrap;
32  text-indent: 100%;
33  overflow: hidden;
34}

macOS Big Sur 11.2.3
dreamweaver

hatena19

2021/03/21 06:18

ロゴ画像は、CSSで指定しているサイズ（150x36）になってますか。

tetsuya7724

2021/03/21 07:30

ロゴのサイズが違っていたので修正しました。また、<a>タグに画像を貼り付けていたので、<header-logo>に貼り直し。 cssを修正したら行けました。 .header-logo { background-image: url("../img/tohoku.logo.svg"); height: 36px; width: 150px; background-repeat: no-repeat; margin: 15px; }