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

質問編集履歴

1

コードを追記しました

2021/05/28 06:52

投稿

tamina
tamina

スコア136

title CHANGED
File without changes
body CHANGED
@@ -12,4 +12,52 @@
12
12
  動的にコンテンツが増えることで、
13
13
  ブラウザ内部の表示位置の計算がずれているのだと思われます。
14
14
 
15
- 対応方法が分かる人がいましたら教えてください。
15
+ 対応方法が分かる人がいましたら教えてください。
16
+
17
+ ```html
18
+ html>
19
+ <header><script type="text/javascript" src="/js/footerFixed.js"></script> </header>
20
+ <body>
21
+ <div>
22
+ <div id="line__container" class="line__container" ></div>
23
+ ↑ここがAjaxで要素がどんどん追加される
24
+ </div>
25
+ <footer id="footer">
26
+ <div id="preview"></div>
27
+ <form action="chatMain.php" method="post" enctype="multipart/form-data">
28
+ <p>発言
29
+ <input name="ChatRoomID" id="ChatRoomID" value="<?php echo $GLOBALS["ChatRoomID"]; ?>" hidden="true" />
30
+ <input name="userID" id="userID" value="<?php echo $GLOBALS["userID"]; ?>" hidden="true"/>
31
+ <input type="text" name="chatinfo" value=" ">
32
+ <label class="upload-label">送る
33
+ <input type="submit" name="_upload" value="送る" >
34
+ </label>
35
+ <label class="upload-label">画像
36
+ <input type="file" name="picture[]" id="picture" accept="image/*" multiple="multiple">
37
+ </label>
38
+ </p>
39
+ </form>
40
+ </footer>
41
+ </body>
42
+ </html>
43
+ ```
44
+
45
+
46
+ ```css
47
+ html {
48
+ background-color: #80dddd; /* 両端部分に付ける背景色(黄緑色) */
49
+ background-image: url("WallSheat.jpg");/* 両端部分に付ける背景画像 */
50
+ }
51
+ body {
52
+ margin: 0px 15%; /* 外側の余白を、上下はゼロで左右は画面横幅の15%に */
53
+ padding: 0px; /* 内側の余白を消す */
54
+ background-color: lightsteelblue; /* 本文部分の背景色は白色 */
55
+
56
+ }
57
+ footer{
58
+ width: 100%;
59
+ position: absolute;/*←絶対位置*/
60
+ bottom: 0; /*下に固定*/
61
+ }
62
+
63
+ ```