I am using html and css to write an exam and I have created a <div> class for the questions that is supposed to provide the space for the students to write their answers.
However the code does not work and I cannot figure out what the problem is. Below is an example of the not-working code.
Please help me understand why this isn’t working as intended.
<html>
<head>
<style type="text/css">
body, pre {
font-family: serif;
margin-left: 12%;
margin-right: 12%;
text-align: justify;
font-size: 110%;
{
.shortAnsw {
padding-bottom: 5cm;
}
.longAnsw {
padding-bottom: 10cm;
}
.answer {
display: none;
}
</style>
</head>
<body>
<h1>Exam 1</h1>
<p>
<strong> Please write your name only on the back of the last page of the exam. </strong>
</p>
<h2>Short Answer</h2>
<p>
Please answer the following questions in no more than 3 sentences.
</p>
<ol>
<li>
<div class="longAnsw">
question 1
</div>
</li>
<li>
<div class="shortAnsw">
question 2
</div>
</li>
<li>
<div class="shortAnsw">
question 3
</div>
</li>
</ol>
</body>
</html>
You have a backwards
{.