フッターをページの一番下に配置したい
フッターを一番下に配置したいのですがうまくいきません
画面の下には固定されるのですがページの一番下に固定されません
該当のソースコード
html
1<!DOCTYPE html> 2<html lang="ja" dir="ltr"> 3 <head> 4 <meta charset="utf-8"> 5 <title>AAAAA</title> 6 <meta name="viewport" content="width=device-width, initial-scale=1"> 7 <meta name="description" content="株式会社AAAのホームページです。"> 8 <meta name="keywords" content="aaaaa"> 9 <link rel="stylesheet" href="css/menu.css"> 10 <link rel="stylesheet" href="css/anime.css"> 11 <link rel="stylesheet" href="css/footer.css"> 12 <link rel="stylesheet" href="css/home.css"> 13 14 <nav class="fix"> 15 <div class="inner flex"> 16 <div class="logo"> 17 <a href="home.html">AAAAAAA</a> 18 </div> 19 20 <div class="menu"> 21 <ul class="snip1226"> 22 <li><a href="manufacturing.html" data-hover="MANUFACTURING">MANUFACTURING</a></li> 23 <li><a href="product.html" data-hover="PRODUCT">PRODUCT</a></li> 24 <li><a href="company.html" data-hover="COMPANY">COMPANY</a></li> 25 <li><a href="recruit.html" data-hover="RECRUIT">RECRUIT</a></li> 26 <li><a href="contact.html" data-hover="CONTACT">CONTACT</a></li> 27 </ul> 28 </div> 29 </div> 30 </nav> 31 32 <body> 33 <p class="menuchar">AAAAAAA CO.Ltd.</p> 34 35<div> 36 <img src="image/golf.jpg" width=100% alt="golf" > 37</div> 38 39 <div> 40 <img src="image/jockey.jpg" width=100% alt="jockey" > 41 </div> 42 43</body> 44 45 46 <footer class="footer"> 47 <p class="copyright">AAAAAAA CO.Ltd.</p> 48 </footer> 49 50 51 52 53</html> 54
css
1footer{ 2 color: #000000; 3 background-color:#FFFFFF;/*フッターの背景色指定*/ 4 height:300px;/*フッターの縦の大きさ*/ 5 width:100%;/*フッターの横幅*/ 6 position: absolute; 7 bottom: 0; 8} 9 .copyright{ 10 position: absolute;/*←絶対位置*/ 11 bottom: 30px; 12 right: 30px; 13 } 14 15/*home画面関連*/ 16 17.inner{ 18 max-width:100%;/*領域幅の最大値*/ 19 margin:0px auto; 20 width:90%;/*横幅の指定*/ 21} 22 23.golf{ 24 position: relative; 25 text-align:center; 26 27} 28.jockey{ 29 position: relative; 30 text-align:center; 31 32} 33 34body{ 35 height: auto; 36} 37
補足情報
![イメージ説明](c151462287f5e775ec68ec765f8e4187.png) ![イメージ説明](24b201e78103ffe36cbb78b0e62b6506.png) 最初の画面上でのみ下に固定されている状態です
回答4件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2020/06/19 04:10
2020/06/19 07:04
2020/06/19 07:06
2020/06/19 07:38
2020/06/19 07:41