One method for creating a border around only the words in a section that contains five fill in the blank questions in HTML is to wrap the words in each question with a span tag and apply a CSS style to the span tags. Here's an example code:
HTML:
<div class="question-section">
<h2>Fill in the blanks:</h2>
<p>
1. The capital city of France is <span class="word">___</span>.<br>
2. The largest planet in our solar system is <span class="word">___</span>.<br>
3. The process of converting sugar into alcohol is called <span class="word">___</span>.<br>
4. The largest organ in the human body is the <span class="word">___</span>.<br>
5. The highest mountain in the world is <span class="word">___</span>.
</p>
</div>
CSS:
.question-section .word {
border: 1px solid black;
padding: 2px;
}
In this code, the span tags with class "word" wrap around the blank spaces in each question. The CSS style for ".question-section .word" applies a 1px solid black border and 2px padding to each span tag. This creates a border around only the words inside each span tag, rather than the entire question section.
Please start posting anonymously - your entry will be published after you log in or create a new account. This space is reserved only for answers. If you would like to engage in a discussion, please instead post a comment under the question or an answer that you would like to discuss
Asked: 2023-06-24 11:07:49 +0000
Seen: 8 times
Last updated: Jun 24 '23
How to give an <svg> element a double border using CSS when there is no style attribute present?
What is the method for altering the outline/border of a disabled OutlinedInput in MUI?
What is the method to eliminate the default table border in Mantine?
What is the method for applying a bottom border exclusively in Jetpack Compose?
What is the process for eliminating the additional border in QTabBar?
How can I modify the border color of a checkbox input using CSS?