teratail header banner
teratail header banner
質問するログイン新規登録

質問編集履歴

2

position:fixed;を使う目的を記載しました。

2018/01/30 12:55

投稿

imuzi.ayustet
imuzi.ayustet

スコア15

title CHANGED
File without changes
body CHANGED
@@ -47,4 +47,8 @@
47
47
 
48
48
 
49
49
 
50
- ご回答よろしくお願いします。
50
+ ご回答よろしくお願いします。
51
+
52
+
53
+ 追記
54
+ このコードで実現したいことは、ヘッダーの中身を左端に寄せずやや中央へ配置しつつ、ページをスクロールしてもヘッダーは動かないように固定することです。

1

コードの記載方法について、<code>で囲みました。

2018/01/30 12:55

投稿

imuzi.ayustet
imuzi.ayustet

スコア15

title CHANGED
File without changes
body CHANGED
@@ -5,7 +5,8 @@
5
5
 
6
6
 
7
7
 
8
-
8
+ ```ここに言語を入力
9
+ <header>
9
10
  <div class="header">
10
11
  <div class="header-wrapper">
11
12
  <div class="header-logo">
@@ -24,19 +25,24 @@
24
25
 
25
26
  </div>
26
27
  </header>
28
+ ```
27
29
 
28
- ーーーーーーーーーーーーーー
29
30
 
31
+ ```ここに言語を入力
30
32
  .header-wrapper{
31
33
  width:1170px;
32
34
  margin: 0px auto;
33
35
  }
36
+ ```
34
37
  ![イメージ説明](d45a1b5ce827143a68f8d84039280487.png)
35
38
 
39
+ 次のコードを加えると、下図のように左に寄ってしまいます。
36
40
 
41
+ ```ここに言語を入力
37
- .header-wrapper
42
+ .header-wrapper{
38
- position:fixed;を加えると次のように左に寄ってしまいます。
43
+ position:fixed;
39
-
44
+ }
45
+ ```
40
46
  ![イメージ説明](9eb3ef25c9dda2f0ff6f03b50ebb3c99.png)
41
47
 
42
48