입력 요소를 추가하고 내 양식에 텍스트를 입력하고 싶지만 내 양식이 내 페이지의 바닥 글과 겹칩니다. 오버플로 속성을 추가하려고했지만 작동하지 않았습니다. 저는 웹 개발에 익숙하지 않아 해결책을 찾을 수 없습니다.
이것은 내 CSS입니다.
* {
margin: 0;
padding: 0;
}
html, body {
height: 99%;
}
.wrapper {
min-height: 100%;
height: auto !important;
height: 100%;
margin: 0 auto -100px; /* the bottom margin is the negative value of the footer's height */
}
.footer, .push {
height: 110px; /* .push must be the same height as .footer */
}
.footer {
width: 100%;
/* Set the fixed height of the footer here */
height: 110px;
background-color: #f5f5f5;
}
*
그리고 이것은 내 HTML입니다.
<body>
<div class="wrapper">
<div class="container">
<div class="text-xs-center">
<form id="questionForm" method="post" autocomplete="off">
<label>Question</label></br>
<textarea name="Question" cols="40" rows="4"></textarea></br>
<label>Answers:</label></br>
<input id="1" name="Answer1" type="text"/></br></br>
<input id="2" name="Answer2" type="text"/></br></br>
<button id="addAnswerButton" type="button" class="btn btn-sm btn-primary" onclick="addAnswerField()">Add Answer Field</button></br></br>
<noscript>
<p>Please enable Java-Script to add more answers</p>
</noscript>
<script type="text/javascript">
function addAnswerField(){
var form = document.getElementById("questionForm");
var thisButton = document.getElementById("addAnswerButton");
// find last Index
var lastIndex = 1;
var lastElement = document.getElementById(lastIndex.toString());
while (lastElement != null) {
lastIndex++;
console.log(lastIndex.toString());
lastElement = document.getElementById(lastIndex.toString());
}
var input = document.createElement("input");
input.type = "text";
input.name = "Answer" + lastIndex;
input.id = lastIndex.toString();
form.insertBefore(input, thisButton);
form.insertBefore(document.createElement("br"), thisButton);
form.insertBefore(document.createElement("br"), thisButton);
}
</script>
<input type="submit" class="btn btn-lg btn-success"/>
</form>
</div>
</div>
</div> <!-- Content -->
<footer class="footer">
<div class="container small">
<p class="text-muted small">I don't have any rights on the Harry Potter Universe. All rights belong to their rightful owners.
This site is using cookies to identify you for the next month. <br/>
Credits - Idea: Laura Weasley Kletschko - Implementation: Niko Percival Wulfric Brian Tzioras <br/>
<a href="impressum.html">Impressumg & Datenschutz</a>
</p>
</div>
</footer>
</body>
바닥 글 위에 하나의 요소를 추가하십시오.
<div class="push">
</div>
<footer class="footer">
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다