ヘッダーリストで右側に寄せて、リストを3つ配置し、さらにヘッダーロゴとヘッダーリストを固定したのですが、画像のようにヘッダーロゴと被って左側に表示されてしまいます。なぜでしょうか?
HTML
1<!DOCTYPE html> 2<html lang="en"> 3<head> 4 <meta charset="UTF-8"> 5 <meta http-equiv="X-UA-Compatible" content="IE=edge"> 6 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 7 <title>Document</title> 8 <link rel="stylesheet" href="練習.css"> 9 <link rel="stylesheet" href="reset.css"> 10 <link rel= "icon" type= "image/png" href="business_man1_1_smile.png"> 11 <title>練習</title> 12</head> 13<body> 14 <header>練習用ヘッダーロゴ</header> 15 <div class="header-list"></div> 16 <ul> 17 <li>ヘッダーリスト1</li> 18 <li>ヘッダーリスト2</li> 19 <li>ヘッダーリスト3</li> 20 </ul> 21 22</body> 23</html>
CSS
1li { 2 list-style: none; 3 float: right; 4 position: fixed; 5} 6 7header { 8 position: fixed; 9}
希望する状態の静止画とか提示できますでしょうか?
現状のHTMLとCSSを見る限り、そうなりますとしか言えないです。
ulとliがheaderタグの中にも入ってませんし、<div class="header-list"></div>の中にも入っていませんがこれであっていますか?
回答1件
あなたの回答
tips
プレビュー