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

質問編集履歴

3

情報の追加

2020/02/27 06:14

投稿

panisyo
panisyo

スコア9

title CHANGED
File without changes
body CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  [こちら](https://template-party.com/db_template/?act=list&kind=1&info9=night&html=list_night.html)のtp_113というテンプレートを使って、サイドバーを追従する形(position: styicky)にしたいのですがうまくいきません。
4
4
 
5
- 自分で追加したコードはhtmlの
5
+ 自分で追加したコードはhtmlの<div id="sub">部分に
6
6
 
7
7
  ```html
8
8
  <div id="sub">
@@ -27,7 +27,7 @@
27
27
 
28
28
  ```
29
29
 
30
- 追加(他のサブメニューは必要なかったので削除しました)
30
+ っという感じで追加(他のサブメニューは必要なかったので削除しました)
31
31
 
32
32
  CSSは**/*subコンテンツ**の一番下に
33
33
 

2

情報の追加

2020/02/27 06:14

投稿

panisyo
panisyo

スコア9

title CHANGED
File without changes
body CHANGED
@@ -2,14 +2,35 @@
2
2
 
3
3
  [こちら](https://template-party.com/db_template/?act=list&kind=1&info9=night&html=list_night.html)のtp_113というテンプレートを使って、サイドバーを追従する形(position: styicky)にしたいのですがうまくいきません。
4
4
 
5
- 自分で追加したコードは
5
+ 自分で追加したコードはhtmlの
6
6
 
7
7
  ```html
8
+ <div id="sub">
9
+
8
- <div class="sticky">
10
+ <nav class="box1">
9
- <p>固定される要素</p>
11
+ <h2>Contents</h2>
12
+ <ul class="submenu">
13
+ <li><a href="company.html">会社概要</a></li>
14
+ <li><a href="link.html">リンク</a></li>
15
+ <li><a href="contact.html">お問い合わせ</a></li>
16
+ <li><a href="#">メニューサンプル</a></li>
17
+ <li><a href="#">メニューサンプル</a></li>
18
+ </ul>
19
+ </nav>
20
+
21
+ <div class=“sticky”>
22
+ 〜追従する要素〜
10
23
  </div>
24
+
25
+ </div>
26
+ <!--/#sub-->
27
+
11
28
  ```
12
29
 
30
+ に追加(他のサブメニューは必要なかったので削除しました)
31
+
32
+ CSSは**/*subコンテンツ**の一番下に
33
+
13
34
  ```CSS
14
35
  .sticky {
15
36
  position: -webkit-sticky;
@@ -18,7 +39,7 @@
18
39
  }
19
40
  ```
20
41
 
21
- です
42
+ を追加しました
22
43
 
23
44
  overflow:hiddenが複数あるので、それが原因だと思うのですが、そこからがわからなくて困ってます。
24
45
  そもそもこのテンプレートを使って追従形にするのは、初心者には無理があるのでしょうか?

1

情報の追加

2020/02/27 06:13

投稿

panisyo
panisyo

スコア9

title CHANGED
File without changes
body CHANGED
@@ -2,6 +2,24 @@
2
2
 
3
3
  [こちら](https://template-party.com/db_template/?act=list&kind=1&info9=night&html=list_night.html)のtp_113というテンプレートを使って、サイドバーを追従する形(position: styicky)にしたいのですがうまくいきません。
4
4
 
5
+ 自分で追加したコードは
6
+
7
+ ```html
8
+ <div class="sticky">
9
+ <p>固定される要素</p>
10
+ </div>
11
+ ```
12
+
13
+ ```CSS
14
+ .sticky {
15
+ position: -webkit-sticky;
16
+ position: sticky;
17
+ top: 10px;
18
+ }
19
+ ```
20
+
21
+ です。
22
+
5
23
  overflow:hiddenが複数あるので、それが原因だと思うのですが、そこからがわからなくて困ってます。
6
24
  そもそもこのテンプレートを使って追従形にするのは、初心者には無理があるのでしょうか?
7
25