Tell us what’s happening:
I’m having issues in formatting a few parts of the survey form I’ve created and some parts overlapping few items of the survey form.
here is the html part of the labels and the radio that are being overlapped by the select dropdown
<div class="form-control">
<p class="form-control">Which of the following best describes you?
<select id="dropdown" name="role" class="form-control" required>
<option disabled selected value>
Select class standing</option>
<option value="Freshman">Freshman</option>
<option value="Sophomore">Sophomore</option>
<option value="Junior">Junior</option>
<option value="Senior">Senior</option>
</select>
</div>
<div class="form-group">
<p>Would you recommend NJCU to a friend?</p>
<label>
<input type="radio" name="user-recommend" value="definitely" class="input-radio" checked />Definetely</label>
<label>
<input type="radio" name="user-recommend" value="maybe" class="input-radio">Maybe</label>
<label>
<input type="radio" name="user-recommend" value="not sure" class="input-radio">Not Sure</label>
</div>
I think I screw up somewhere in the css code.
here is the link of my codepen
Your browser information:
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:75.0) Gecko/20100101 Firefox/75.0
.
Challenge: Build a Survey Form
Link to the challenge: