WordPressでHP作成中CSS Resetに関するエラーが出ました。

WordPressでHP作成中CSSに関するエラーが出ました。

ドットインストールのレッスンのコードを全コピーしたにもかかわらず、以下のエラーが出ました。

CSS Resetに関するエラーかと思われますが、原因がわかりません。
一応、ドットインストール側のコードが古いので今あるコードを
https://yuilibrary.com/yui/docs/cssreset/
から引っ張てきましたがそれも失敗に終わります。

今回初めてレンタルサーバーを借りてのHP作成なのでレンタルサーバーである。mixhostのmy設定がうまくいってない可能性もあります。

環境：Windows１０　WordPress5.2.1-ja mixhost

html
1<!DOCTYPE html>
2<html lang="ja">
3    <head>
4        <meta charset="utf-8">
5        <title>はじめてのWordPress</title>
6        <link rel="stylesheet" type="text/css" href="http://yui.yahooapis.com/3.18.1/build/cssreset/cssreset-min.css">
7        <link rel="stylesheet" type="text/css" href="style.css">
8    </head>
9    <body>
10        <div id="header" class="container">
11            <h1><a href="">はじめてのWordPress</a></h1>
12            <ul class="menu">
13                <li><a href="">menu</a></li>
14                <li><a href="">menu</a></li>
15                <li><a href="">menu</a></li>
16            </ul>
17        </div><!-- /header -->
18        <div id="main" class="container">
19            <div id="posts">
20                posts
21            </div><!-- /posts -->
22            <div id="sidebar">
23                sidebar
24            </div><!-- /sidebar -->
25        </div><!-- /main -->
26        <div id="footer" class="container">
27            footer
28        </div><!-- /footer -->
29    </body>
30</html>
31

css
1body {
2    font-size: 14px;
3    font-family: Arial, Verdana;
4}
5
6a {
7    text-decoration: none;
8}
9
10p {
11    padding-bottom: 14px;
12    margin: 0;
13    line-height: 1.8;
14}
15
16.container {
17    width: 600px;
18    margin: 0 auto;
19    overflow: hidden;
20}
21
22/* header */
23
24#header {
25
26}
27
28    h1 {
29        font-weight: bold;
30        font-size: 18px;
31        padding: 15px 0;
32    }
33
34    .menu {
35        background: #f39800;
36        margin-bottom: 30px;
37        font-size: 12px;
38        list-style: none;
39        overflow: hidden;
40        padding: 0;
41    }
42
43        .menu > li {
44            float: left;
45            width: 150px;
46            text-align: center;
47        }
48
49        .menu a {
50            padding: 10px 0;
51            color: #fff;
52            display: block;
53        }
54
55        .menu a:hover {
56            background: #ffc35c;
57        }
58
59/* posts */
60
61#posts {
62    float: left;
63    width: 435px;
64}
65
66    .post {
67
68    }
69
70        .post-header {
71
72        }
73
74            .post-header h2 {
75
76            }
77
78            .post-meta {
79
80            }
81
82        .post-content {
83
84
85        }
86
87/* sidebar */
88
89#sidebar {
90    float: right;
91    width: 150px;
92}
93
94/* footer */
95
96#footer {
97    padding: 15px 0;
98    font-size: 12px;
99    color: #aaa;
100    border-top: 1px solid #ccc;
101
102}

※１Mixed Contentの防止に関するサイトを参照して少し改善されましたが、いまだにCSSが反映されません。

上記のエラーが発生します。

style.cssとCssresetが見つからないと記しているのでしょうか？

※２アップロード先のパスです。

public_html - ????.com - wp-content - themes - hp_sakusei - style.css

これらのことでしょうか？

それとも

行動規範の内容に同意します

回答1件

https な URL のウェブページから http な URL の JavaScript や CSS を呼び出すことは、Mixed Content (混在コンテンツ)として、Web ブラウザでの表示が制限されています。
CSS を https な URL で、呼び出すようにしてください。

参考：

投稿2019/06/08 23:11

CHERRY

総合スコア25171

HozDer

2019/06/09 00:59 編集

返信ありがとうございます。 Mixed Contentに関する問題は上記のサイトを参考に改善されたように感じますが、まだCSSが適応されません。質問の方も修正させていただきましたが、style.cssとCssresetが見つからないと記しているのでしょうか？今404エラーメッセージについて調べてはいますが、何が原因かわかりません。

CHERRY

2019/06/09 00:54

エラー画像の下側の 404 エラーですが、Yui CSS Reset ( https://yuilibrary.com/yui/docs/cssreset/ ) を確認した感じでは https な URL が用意されていないため、404 エラーになっているようです。対応としては、Yui CSS Reset の提供ライセンスは BSD ライセンスなので、 `http://yui.yahooapis.com/3.18.1/build/cssreset/cssreset-min.css` のファイルをご自身のサーバーにダウンロードして、ご自身のサーバーのダウンロードしたファイルの URL にリンクタグを書き換えるのが良いと思います。

CHERRY

2019/06/09 00:56

上のエラーについては、style.css ファイルがどこに置かれているのかわからないと回答は難しいと思いますので、ファイルのアップロード先のパスを記載していただけないでしょうか？

HozDer

2019/06/09 01:35

返信ありがとうございます。初心者すぎて、回答の意図を読み取れてない可能性があります。 YuiCssresetのダウンロード場所とどこのパスを見ればよいかを質問の修正をしましたので、そちらを見ていただけますか？よろしくお願いします。

CHERRY

2019/06/09 05:19 編集

一番最後に書かれている index.php と style.css と WordPress の関連がわからないのですが、これは、サーバーの WordPress のどこにアップロードしたのでしょうか？

HozDer

2019/06/09 06:42

mixhostというサーバーを利用してHP作成していまして最後のフォルダーはデスクトップに保存してあるものです。それ以外に追加した画像はmixhostの内部にあるファイルマネージャーを展開したものです。 public_html - ????.com - wp-content - themes - hp_sakusei このhp_sakusei の部分にindex.phpとstyle.cssを格納しています。初心者すぎるがゆえに、一番下のいらない画像を送ってしまってるかもしれません。すみません。

行動規範の内容に同意します