<div class="card">
<h1>Modal Verbs and Prepositions</h1>
<label>Name:<input type="text" placeholder="Your name"></label>
<br><br>
<label>Date:<input type="date"></label>
<hr>
<div class="callout">
Fill in the correct modal verbs and prepositions. Sometimes the sentences are affirmative (+), and sometimes they are negative (-). If more than one word applies, use the format answer 1/answer 2.
</div>
<div class="callout-brown">
Remember to check your answers carefully before submitting!
</div>
<div class="card">
<p><strong>Exercise 1:</strong> Write the correct modal verbs in the gaps.</p>
<div class="card2">
<p><strong>1.</strong> It
<input type="text" id="q1" class="fill-box1"><span id="q1-feedback"></span>
rain. If it does, we will go
<input type="text" id= "q2" class="fill-box1"><span id="q2-feedback"></span> the museum instead of the park.
</p>
</div>
<div class="card2">
<p><strong>2.</strong> We
<input type="text" id="q3" class="fill-box1"><span id="q3-feedback"></span>
take a train
<input type="text" id="q4" class="fill-box1"><span id="q4-feedback"></span> Český Krumlov—it's beautiful and not far away. What do you think?
</p>
</div>
<div class="card2">
<p><strong>3.</strong> We
<input type="text" id="q5" class="fill-box1"><span id="q5-feedback"></span>
book our accommodation
<input type="text" id="q6" class="fill-box1"><span id="q6-feedback"></span> we go, or we might not find a room.
</p>
</div>
<div class="card2">
<p><strong>4.</strong> You
<input type="text" id="q7" class="fill-box1"><span id="q7-feedback"></span>
wear comfortable shoes because we will walk a lot
<input type="text" id="q8" class="fill-box1"><span id="q8-feedback"></span> the old town. Don't forget to pack them!
</p>
</div>
<div class="card2">
<p><strong>5.</strong> We
<input type="text" id="q9" class="fill-box1"><span id="q9-feedback"></span>
visit a medieval castle near Třebon. We are not sure yet.
</p>
</div>
<div class="card2">
<p><strong>6.</strong> We
<input type="text" id="q10" class="fill-box1"><span id="q10-feedback"></span>
stop
<input type="text" id="q11" class="fill-box1"><span id="q11-feedback"></span> a local restaurant to eat trout—it's a specialty there. Do you agree?
</p>
</div>
<div class="card2">
<p><strong>7.</strong> You
<input type="text" id="q12" class="fill-box1"><span id="q12-feedback"></span>
forget your ID card
<input type="text" id="q13" class="fill-box1"><span id="q13-feedback"></span> traveling between towns. It is very important.
</p>
</div>
<div class="card2">
<p><strong>8.</strong> We
<input type="text" id="q14" class="fill-box1"><span id="q14-feedback"></span>
need to check the itinerary
<input type="text" id="q15" class="fill-box1"><span id="q15-feedback"></span> we leave home. I don't want to miss our train.
</p>
</div>
<div class="card2">
<p><strong>9.</strong> You
<input type="text" id="q16" class="fill-box1"><span id="q16-feedback"></span>
bring a camera to take photos
<input type="text" id="q17" class="fill-box1"><span id="q17-feedback"></span> the Šumava Mountains. It's good to have pictures from trips.
</p>
</div>
<div class="card2">
<p><strong>10.</strong> We
<input type="text" id="q18" class="fill-box1"><span id="q18-feedback"></span>
get lost without a map or GPS, so let's plan our route
<input type="text" id="q19" class="fill-box1"><span id="q19-feedback"></span>
the forest carefully.
</p>
</div>
<div class="card2">
<p><strong>11.</strong> We
<input type="text" id="q20" class="fill-box1"><span id="q20-feedback"></span>
visit everything
<input type="text" id="q21" class="fill-box1"><span id="q21-feedback"></span>
one weekend, so we need to choose what's most important.
</p>
</div>
</div>
<br>
<hr>
<br>
<button class="button" onclick="checkALL()">Check all</button>
<button class="button" onclick="exportPDF()">Export PDF</button>
<head>
<meta charset="UTF-8">
<title>Worksheet 26-4.9.</title>
<style>
:root {
--text: #222222;
--background: #f8f5f2;
--accent: #e6e0D8;
--border: #72614D;
--callout-brown-bg: #efe2cc;
--callout-brown-acc: #6f4e26;
}
body {
font-family: Georgia, serif;
background-color: var(--background);
margin: 40px auto;
max-width: 780px;
color: #222;
font-size: 1rem;
line-height: 2;
}
.card {
background: white;
border-radius: 12px;
padding: 12px 14px;
box-shadow: 0 1px 4px rgba(0,0,0,0.08);
}
.card2 {
background: white;
border-radius: 12px;
padding: 24px 28px;
box-shadow: 0 1px 4px rgba(0,0,0,0.08);
}
.callout {
border-radius: 7px;
padding: 14px 18px;
margin: 14px 0;
border-left: 4px solid var(--accent);
}
.callout-brown {
background: var(--callout-brown-bg);
border-radius: 7px;
padding: 14px 18px;
margin: 14px 0;
border-left: 4px solid var(--callout-brown-acc);
}
input[type="text"]:not(.fill-box1) {
border: none;
border-bottom: 2px solid var(--border);
padding: 2px 6px;
font-size: inherit;
outline: none;
background: transparent;
display: inline;
vertical-align: bottom;
margin-top: 8px;
}
.button {
background: var(--background);
border-color: var(--border);
border-radius: 7px;
padding: 6px 18px;
font-size: inherit;
}
.fill-box1 {
max-width: 50px;
font-size: inherit;
font-family: inherit;
border-radius: 7px;
border-color: var(--accent);
margin-left: 6px;
margin-right: 6px;
margin-top: 0;
vertical-align: baseline;
}
function exportPDF() {
window.print()
}
function check(id) {
var input = document.getElementById(id);
var feedback = document.getElementById(id + '-feedback');
var accepted = Array.from(arguments).slice(1);
var answer = input.value.trim().toLowerCase();
if (accepted.includes(answer)) {
feedback.textContent = 'Correct!';
feedback.style.color = '#10b981';
} else {
feedback.textContent = 'Try again!';
feedback.style.color = '#ef4444';
}
}
function checkALL() {
check('q1', 'might', 'may', 'might/may', 'may/might');
check('q2', 'to');
check('q3', 'could', 'can', 'could/can', 'can/could');
check('q4', 'to');
check('q5', 'should');
check('q6', 'before');
check('q7', 'must');
check('q8', 'in', 'around', 'in/around', 'around/in');
check('q9', 'might', 'may', 'might/may', 'may/might');
check('q10', 'could', 'can', 'could/can', 'can/could');
check('q11', 'at', 'by', 'at/by', 'by/at');
check('q12', "mustn't", 'must not');
check('q13', 'for');
check('q14', 'will');
check('q15', 'before');
check('q16', 'should');
check('q17', 'of', 'in', 'of/in', 'in/of');
check('q18', 'might', 'may', 'might/may', 'may/might');
check('q19', 'in', 'through', 'in/through', 'through/in');
check('q20', "can't", 'cannot');
check('q21', 'in', 'during', 'in/during', 'during/in');
}