As I embark on my journey with HTML and CSS, I have encountered two issues while creating a form:
- The spacing between the question and answers is too wide. The second picture depicts how I would like it to appear.
- The cursor:pointer seems to be extending out of the text area, going to the top and side. I attempted to adjust the margin of the radio-buttons but it resulted in the cursor:pointer covering the question.
.form-element {
display: flex;
flex-direction: column;
margin: 0 0 20px 0;
}
.form-element span {
margin: 0 0 5px 0;
}
.radio-buttons {
display: flex;
align-items: left;
}
.radio-buttons label {
cursor:pointer;
}<div class="form-element radio-buttons">
<span>Would you like to remain anonymous?*</span>
<label for="No.‎"><br />
<input type="radio" required id="No.‎" name="entry.1808372660" value="No.‎" />
<span>No</span>
<label for="Yes"><br />
<input type="radio" required id="Yes" name="entry.1808372660" value="Yes" />
<span>Yes</span>
</div>