Can't seem to align Checkbox and Label together.

This Forms Survey

Survey This Survey

Thanks for taking the time to complete this survey

Name: Email: What is your age?
<fieldset>

How did you hear about this survey?

    <label>Where are you to most likely see a form of this architect? (Select all that apply)</label>
    <label for="amazonCheck">Amazon <input id="amazonCheck" name="MostLikely" type="checkbox" value="amazon"></label>
    <label for="walmartCheck">Walmart <input id="walmartCheck" name="MostLikely" type="checkbox" value="walmart"></label>
    <label for="targetCheck">Target <input id="targetCheck" name="MostLikely" type="checkbox"></label>
    <label for="bestbuyCheck">BestBuy <input id="bestbuyCheck" name="MostLikely" type="checkbox" value="bestbuy"></label>
    <label for="discordCheck">Discord <input id="discordCheck" name="MostLikely" type="checkbox" value="discord"></label>
    <label for="steamCheck">Steam <input id="steamCheck" name="MostLikely" type="checkbox" value="steam"></label>
    <label for="noneAboveCheck">None of the Above<input id="noneAboveCheck" name="MostLikely" type="checkbox" value="none_of_the_above"></label>
    </fieldset>



    <fieldset>
       <legend id="professional">Does this survey look professional? </legend>
    <input id="professional" class="inline" name="Professional" type="radio" checked/><label for="professional"> Yes</label>

    <input id="professional" class="inline" name="Professional" type="radio"/><label for="professional"> No</label>
    </fieldset>
  <fieldset>
    <label for ="userComments">Comment and Questions are always appreciated.
    <textarea id="userComments" name="UserComments" placeholder="This survey is awesome ..." rows="3" cols="20"></textarea>
    </label>
    </fieldset>
    <input type="submit" value="submit">
  • {
    box-sizing: border-box;
    margin: 0;
    }

body {
font-size: 18px;
font-family: ‘lora’, sans-serif;
background-color: #000000;
color: #ffffff;
}

form {
margin: 0 auto;
width: 60vh;
}

h1 {
font-family: ‘Oswald’, sans-serif !important;
}

h1, p {
text-align: center;
margin: 0 auto;
}

fieldset {
border: none;
margin: 10px 0 0 0;
}

fieldset:last-of-type {
border-bottom: 2px solid
}

textarea, input, select {
width: 100%;
margin: 10px 0;
}

label {
display: block;

}

textarea {
width: 100%;
}

input[type=“checkbox”] {
display: inline-block;
vertical-align: middle;
}

input[type=“submit”] {
width: 15%;
display: block;
margin: 0.5em auto;
}

input[type=“submit”]:hover {
cursor: pointer;
}

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.