CSS float 横並びにしたい

Question

前提・実現したいこと

h1とliのところを横並びに表示したいのんですが、float: leftでは表示がでできません。
わかる方教えて下さい。

発生している問題・エラーメッセージ

エラーメッセージ

該当のソースコード

<h1 class="header-logo">Progate</h1> <li class="header-list"></li> <ul> <li>プログラミングとは</li> <li>学べるレッスン</li> <li>お問い合わせ</li> </ul> ソースコード ```

試したこと

li {
list-style: none;
: left;float

}

ここに問題に対して試したことを記載してください。

補足情報（FW/ツールのバージョンなど）

ここにより詳細な情報を記載してください。

Comments

[gpsoft]

> h1とliのところを横並びに表示したい

ulの中にある3つのli同士を横に並べるだけでなく、h1も横に並べたいのでしょうか?

あと、htmlの2行目にあるliって、必要ですか?

Answer 1

<h1 class="header-logo">Progate</h1> の隣に<li class="header-list"></li> を置きたいのであれば（やり方は色々ありますが） h1 { float:left; } もしくは .header-logo { float:left; } でいいのではないでしょうか。

Answer 2

タイプミスか提示されていないソースの部分が影響しているのでは？
以下コピペして確かめてください

<style>
ul{
margin:0;
padding:0;
}
li {
list-style: none;
float:left;
}
</style>
<ul>
<li>プログラミングとは</li>
<li>学べるレッスン</li>
<li>お問い合わせ</li>
</ul>

Answer 3

既にLhankor_Mhyさんの回答で合ってそうなので、
cssセレクターについてしっかり理解することをおすすめします。

Comments

[mayugee228]

ご回答ありがとうございます。
記述間違いで逆になってました、、
float: left;
と打っても表示されなかったので質問しました。

[K_3578]

だったら、提示されていない範囲に何かしらの影響があるかと。ソースコード全文提示してください。

それと、ソースコードはMarkDownの<code>ブロック内に貼り付けてご提示ください。

Answer 4

打ち間違いでは。

: left;float →float: left;

Comments

[mayugee228]

ご回答頂きありがとうございます。
すみません、記述間違いでした。
float: left;
と打っても表示されなかったので、質問しました。。

[Lhankor_Mhy]

当方では横並びになりました。
「表示されなかった」とは、なにが表示されませんでしたか？

[Lhankor_Mhy]

ご解決されませんか？

なにかわからない点があれば、コメント欄でお知らせください。

[Erunoa]

display:flexではだめでしょうか？