0
フッタがページの下部に来ないページを開発しました。フッタがヘッダーの直後に来るのではなく、下部に来ています。 私はほとんどすべてのオプションを試しましたが、私はこれを解決することができません。フッタがページの下部に来ていません
A
答えて
2
これらの絶対的な位置は本当に助けにはなりません。相対的なポジションを試してみてください - 私のスニペットを見てください。適切なマークアップとオフセットなしabsolute`：
* { margin:0; padding:0; }
.floatleft {float:left !important;}
.floatright {float:right !important;}
.floatnone {float:none !important;}
.alignleft {text-align:left !important;}
.alignright {text-align:right !important;}
.aligncenter {text-align:center !important;}
.no-display { display:none; }
.no-margin { margin:0 !important; }
.no-padding { padding:0 !important; }
a:focus, button:focus {outline:0px solid}
img {
max-width:100%;
height:auto;
border:0;
vertical-align:top;
}
.fix {overflow:hidden}
h1, h2, h3, h4, h5, h6 {
margin: 0 0 10px;
\t color:#000;
}
a {transition: all 0.3s ease 0s;text-decoration:none;}
a:hover {
color: #fff;
text-decoration: none;
}
a:active, a:hover, a:focus {
outline: 0 none;
text-decoration: none
}
.clear{clear:both}
#wrapper
{
\t height:100%;
\t width:100%;
}
body {
color: #000;
height:100%;
width:100%;
font-size: 16px;
line-height: 20px;
text-align: left;
overflow-x:hidden;
}
#header {
\t width:100%;
\t height:100px;
}
#logo{
\t clear:both;
\t margin:20px;
}
#logo a {
display: block;
margin-left: -18px;
position: relative;
}
#quiz input {
vertical-align: middle;
}
#quiz ol {
margin: 0 0 10px 20px;
}
#quiz ol li {
margin: 0 0 20px 0;
}
#quiz ol li div {
padding: 4px 0;
}
#quiz h3 {
font-size: 17px; margin: 0 0 1px 0; color: #000;
font-family: 'Roboto', sans-serif;
\t font-weight:600;
}
#quiz label
{
\t font-family: 'Roboto', sans-serif;
\t font-weight:normal;
}
#results {
font: 44px Georgia, Serif;
}
center
{
\t font-size:xx-large;
\t padding:20px 0 50px 0;
\t font-family: 'Roboto', sans-serif;
}
.form-footer .button {
margin-right: 10px;
margin-bottom: 5px;
\t color: #fff;
text-shadow: 0 1px rgba(0, 0, 0, 0.08);
\t background-color: #ecae3d;
\t \t border: 0;
height: 42px;
line-height: 1;
font-size: 15px;
cursor: pointer;
padding: 0 35px;
text-align: center;
vertical-align: top;
display: inline-block;
-webkit-user-drag: none;
\t font-family: "Roboto", Arial, Helvetica, sans-serif;
font-weight: 400;
}
.form-footer .button:hover{
\t
\t background-color:#DBDBDB;
\t color:#000;
}
#quiz {
left: 50%;
margin-left: -25%;
position: relative;
}
#footer{
\t width:100%;
\t height:80px;
\t background-color:#2D2D2D;
\t color:#9C9C9C;
\t clear:both;
}
#footer #footer-center
{
\t font-size:18px;
\t margin:auto;
\t font-family: "Roboto", Arial, Helvetica, sans-serif;
\t clear:both;
\t padding:20px 0 0 0 ;
\t
}
.survey-form
{
\t width:100%;
}<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
\t <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
\t <meta name="viewport" content="width=device-width, initial-scale=1"/>
\t
\t <link rel="stylesheet" type="text/css" href="CSS/bootstrap.css"/>
\t <link rel="stylesheet" type="text/css" href="CSS/style.css"/>
\t <link rel="stylesheet" type="text/css" href="CSS/responsive.css"/>
</head>
<body class="no-transition stretched">
<div id="wrapper" class="clearfix">
<header id="header" class="full-header">
\t \t \t \t \t <!-- Logo-->
\t \t \t \t \t <div id="logo">
\t \t \t \t \t \t <a href="index.html" class="standard-logo"><img src="images/sequreone-logo.png" alt="Secqureone Logo"></a>
\t \t \t \t \t </div><!-- #logo end -->
</header> \t
\t \t
\t \t <div class="survey-form" id="form">
\t \t
\t \t <form action="contact.php" method="post" id="quiz">
\t \t
<ol>
<li>
<h3>Does Your Business have IT Security Policies and Procedures?</h3>
<div>
<input type="radio" name="question-1-answers" id="question-1-answers-A" value="A. Yes" required/>
<label for="question-1-answers-A">A) Yes </label>
</div>
<div>
<input type="radio" name="question-1-answers" id="question-1-answers-B" value="B. No" required/>
<label for="question-1-answers-B">B) No</label>
</div>
</li>
<li>
<h3>Does Your Business follow one or more of these Standards/Compliance regulations ?</h3>
<div>
<input type="radio" name="question-2-answers" id="question-2-answers-A" value="A. PCI" required/>
<label for="question-2-answers-A">A) PCI</label>
</div>
<div>
<input type="radio" name="question-2-answers" id="question-2-answers-B" value="B. HIPAA" required/>
<label for="question-2-answers-B">B) HIPAA</label>
</div>
<div>
<input type="radio" name="question-2-answers" id="question-2-answers-C" value="C. FISMA" required/>
<label for="question-2-answers-C">C) FISMA</label>
</div>
<div>
<input type="radio" name="question-2-answers" id="question-2-answers-D" value="D. GLBA" required/>
<label for="question-2-answers-D">D) GLBA</label>
</div>
\t \t \t \t \t
\t \t \t \t \t <div>
<input type="radio" name="question-2-answers" id="question-2-answers-E" value="E. SOX" required />
<label for="question-2-answers-E">E) SOX</label>
</div>
<div>
<input type="radio" name="question-2-answers" id="question-2-answers-F" value="F. ISO27001" required/>
<label for="question-2-answers-F">F) ISO 27001</label>
</div>
<div>
<input type="radio" name="question-2-answers" id="question-2-answers-G" value="G. others" required/>
<label for="question-2-answers-G">G) Others</label> <input type="text"/>
</div>
</li>
<li>
<h3>Does Your Business have a Backup and Recovery Plan?</h3>
<div>
<input type="radio" name="question-3-answers" id="question-3-answers-A" value="A. Yes" required/>
<label for="question-3-answers-A">A) Yes </label>
</div>
<div>
<input type="radio" name="question-3-answers" id="question-3-answers-B" value="B. No" required/>
<label for="question-3-answers-B">B) No </label>
</div>
</li>
<li>
<h3>Does Your Business have end-point anti-virus protection in all desktops and laptops?</h3>
<div>
<input type="radio" name="question-4-answers" id="question-4-answers-A" value="A. Yes" required/>
<label for="question-4-answers-A">A) Yes</label>
</div>
<div>
<input type="radio" name="question-4-answers" id="question-4-answers-B" value="B. No" required/>
<label for="question-4-answers-B">B) No</label>
</div>
</li>
\t \t \t \t
\t \t \t \t <li>
<h3>Does Your Business perform regular patch management to keep servers, desktops, laptops up-to-date?</h3>
<div>
<input type="radio" name="question-5-answers" id="question-5-answers-A" value="A. Yes" required/>
<label for="question-5-answers-A">A) Yes </label>
</div>
<div>
<input type="radio" name="question-5-answers" id="question-5-answers-B" value="B. No" required/>
<label for="question-5-answers-B">B) No </label>
</div>
</li>
\t \t \t \t
<li>
<h3>Is Your Business email system protected against spam,phising and other email threats ?</h3>
<div>
<input type="radio" name="question-6-answers" id="question-6-answers-A" value="A. Yes" required/>
<label for="question-6-answers-A">A) Yes</label>
</div>
<div>
<input type="radio" name="question-6-answers" id="question-6-answers-B" value="B. No" required/>
<label for="question-6-answers-B">B) No</label>
</div>
</li>
\t \t \t \t
\t \t \t \t <li>
<h3>How Frequently does your Business perform Vulnerability Assessment on your IT Insfrastructure & Networks?</h3>
<div>
<input type="radio" name="question-7-answers" id="question-7-answers-A" value="A. Every Month" required/>
<label for="question-7-answers-A">A) Every Month</label>
</div>
<div>
<input type="radio" name="question-7-answers" id="question-7-answers-B" value="B. Every 3 Month" required/>
<label for="question-7-answers-B">B) Every 3 Month</label>
</div>
\t \t \t \t \t
\t \t \t \t \t <div>
<input type="radio" name="question-7-answers" id="question-7-answers-C" value="C. Every 6 Month" required/>
<label for="question-7-answers-C">C) Every 6 Month</label>
</div>
<div>
<input type="radio" name="question-7-answers" id="question-7-answers-D" value="D. Yearly" required/>
<label for="question-7-answers-D">D) Yearly </label>
</div>
\t \t \t \t \t
\t \t \t \t \t <div>
<input type="radio" name="question-7-answers" id="question-7-answers-E" value="E. Never Done" required/>
<label for="question-7-answers-E">E) Never Done </label>
</div>
</li>
\t \t \t \t
\t \t \t \t
\t \t \t \t
\t \t \t \t <li>
<h3>How Frequently does your Business perform Penetration Testing on your IT Insfrastructure & Networks?</h3>
<div>
<input type="radio" name="question-8-answers" id="question-8-answers-A" value="A. Every 3 Month" required/>
<label for="question-8-answers-A">A) Every 3 Month</label>
</div>
<div>
<input type="radio" name="question-8-answers" id="question-8-answers-B" value="B. Every 6 Month" required/>
<label for="question-8-answers-B">B) Every 6 Month</label>
</div>
\t \t \t \t \t
\t \t \t \t \t <div>
<input type="radio" name="question-8-answers" id="question-8-answers-C" value="C. Yearly " required/>
<label for="question-8-answers-C">C) Yearly </label>
</div>
<div>
<input type="radio" name="question-8-answers" id="question-8-answers-D" value="D. Never Done" required/>
<label for="question-8-answers-D">D) Never Done</label>
</div>
</li>
\t \t \t \t <li>
<h3>How Frequently does your Business perform security scanning of your website?</h3>
\t \t \t \t \t <div>
<input type="radio" name="question-9-answers" id="question-9-answers-A" value="A. Every Month" required/>
<label for="question-9-answers-A">A) Every Month</label>
</div>
\t \t \t \t \t
<div>
<input type="radio" name="question-9-answers" id="question-9-answers-B" value="B. Every 3 Month" required/>
<label for="question-9answers-A">B) Every 3 Month</label>
</div>
<div>
<input type="radio" name="question-9-answers" id="question-9-answers-C" value="C. Every 6 Month" required/>
<label for="question-9-answers-C">C) Every 6 Month</label>
</div>
\t \t \t \t \t
\t \t \t \t \t <div>
<input type="radio" name="question-9-answers" id="question-9-answers-D" value="D. Yearly" required/>
<label for="question-9-answers-D">D) Yearly </label>
</div>
<div>
<input type="radio" name="question-9-answers" id="question-9-answers-E" value="E. Never Done" required/>
<label for="question-9-answers-E">E) Never Done</label>
</div>
</li>
\t \t \t \t
\t \t \t \t <li>
<h3>How Frequently does your company perform a firewall audit?</h3>
<div>
<input type="radio" name="question-10-answers" id="question-10-answers-A" value="A. Every 3 Month" required/>
<label for="question-10-answers-A">A) Every 3 Month</label>
</div>
<div>
<input type="radio" name="question-10-answers" id="question-10-answers-B" value="B. Every 6 Month" required/>
<label for="question-10-answers-B">B) Every 6 Month</label>
</div>
\t \t \t \t \t
\t \t \t \t \t <div>
<input type="radio" name="question-10-answers" id="question-10-answers-C" value="C. Yearly" required/>
<label for="question-10-answers-C">C) Yearly </label>
</div>
<div>
<input type="radio" name="question-10-answers" id="question-10-answers-D" value="D. Never Done" required/>
<label for="question-10-answers-D">D) Never Done</label>
</div>
</li>
\t \t \t \t
\t \t \t \t <li>
<h3>Does your business have offsite storage of critical data backups?</h3>
<div>
<input type="radio" name="question-11-answers" id="question-11-answers-A" value="A. Yes" required/>
<label for="question-11-answers-A">A) Yes</label>
</div>
<div>
<input type="radio" name="question-11-answers" id="question-11-answers-B" value="B. No" required/>
<label for="question-11-answers-B">B) No</label>
</div>
</li>
\t \t \t \t
\t \t \t \t <li>
<h3>How Frequently does your company perform a Risk Assessment?</h3>
<div>
<input type="radio" name="question-12-answers" id="question-12-answers-A" value="A. Every 3 Month" required/>
<label for="question-12-answers-A">A) Every 3 Month</label>
</div>
<div>
<input type="radio" name="question-12-answers" id="question-12-answers-B" value="B. Every 6 Month" required/>
<label for="question-11-answers-B">B) Every 6 Month</label>
</div>
\t \t \t \t \t
\t \t \t \t \t <div>
<input type="radio" name="question-12-answers" id="question-12-answers-C" value="C. Yearly" required/>
<label for="question-12-answers-C">C) Yearly </label>
</div>
<div>
<input type="radio" name="question-12-answers" id="question-12-answers-D" value="D. Never Done" required/>
<label for="question-12-answers-D">D) Never Done</label>
</div>
</li>
\t \t \t \t
\t \t \t \t <li>
<h3>How Frequently does your company perform security audit of the cloud based application that you use?</h3>
<div>
<input type="radio" name="question-13-answers" id="question-13-answers-A" value="A. Every 3 Month" required/>
<label for="question-13-answers-A">A) Every 3 Month</label>
</div>
<div>
<input type="radio" name="question-13-answers" id="question-13-answers-B" value="B. Every 6 Month" required/>
<label for="question-13-answers-B">B) Every 6 Month</label>
</div>
\t \t \t \t \t
\t \t \t \t \t <div>
<input type="radio" name="question-13-answers" id="question-13-answers-C" value="C. Yearly" required/>
<label for="question-13-answers-C">C) Yearly </label>
</div>
<div>
<input type="radio" name="question-13-answers" id="question-13-answers-D" value="D. Never Done" required/>
<label for="question-13-answers-D">D) Never Done</label>
</div>
</li>
\t \t \t \t
</ol>
<div class="form-footer text-left">
<button type="submit" data-btntext-sending="Next" class="button btn-primary">Submit</button>
</div> \t \t
\t \t
\t \t </form>
\t \t
\t \t <div id="footer">
\t \t
\t \t <center id="footer-center"> Copyright © 2016 XYZcorp,Inc. All rights reserved </center>
\t \t </div>
\t \t </div>
\t \t
\t \t
\t
\t </div>
</body>
</html>関連する問題
- 1. ページ下部にフッタが残っていません
- 2. CSSフッタがページの下部にくっついていない
- 3. フッタはページの一番下には残っていません
- 4. 絶対フッタがページ下部に貼られていない、モバイル
- 5. フォームの後にページ下部にフッタが残らない
- 6. フッタがページの下部に表示されない
- 7. フッタがページの下部にコンテンツを重複します
- 8. ページ下部のCSS-位置フッタ
- 9. 常に下にフッタが動作していません
- 10. 固定フッタは最下部にありません
- 11. フッタはFirefoxの一番下には残っていません
- 12. フッタが下部に位置する
- 13. なぜ私のフッタはページの下部に留まらないのですか？
- 14. ページが短い場合は、ウィンドウの下部にHTMLフッタを置く
- 15. CSS：ページの下部にフッタを付ける方法
- 16. フッタがフレックスボックスのメインコンテンツの下に配置されていません
- 17. フッタは小さな画面の下部には結合しません
- 18. フッタがページ下部に貼られていない（固定されていない）
- 19. フッタがページの下に固定されない
- 20. フォーカスがJavaScriptに来ていません
- 21. フッタの下の空白のページ
- 22. フッターは一番下まで来ていません
- 23. 私のフラッシュギャラリーが来ていません
- 24. htmlの印刷中に各ページの下部にフッタを表示する
- 25. Divタグ（アニメーション矢印）がページの左下にあり、フッタのすぐ上にはありません
- 26. フッターはページの下部にありません
- 27. 一部のページがSonarqubeにロードされていません5.6.6
- 28. 4K画面の下部に付箋の付いたフッタです。
- 29. セッション値が来ていません
- 30. フッターがページの下部にない
すべては '位置に配置されます。 – Era
私はjsfiddleでそれをテストし、それが https://jsfiddle.net/w3rz1vwe/ –
削除フッターに来る #quiz { 左：50％; margin-left：-25％; ポジション：絶対; } 。調査書 { \t幅：100％; } 位置：両方から絶対 –