Tell us what’s happening:
Describe your issue in detail here.
How can i organise with CSS the elements in the checkbox and in the radio buttons?? Thanks a lot
Your code so far
<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="styles.css">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>CaseVacanzeRoma</title>
</head>
<body>
<section class='organizza'>
<h1 id='title'>Sondaggio Case Vacanze Roma</h1>
<p id='description'>Valutazione soddisfazione dei clienti 😃</p>
<form id='survey-form'>
<div class='datiPersonali'>
<label id='name-label' for='name'>Nome:
<input type='text' name='nome' placeholder='nome' required id='name'></label>
<label id='email-label' for='email'> Email: <input type='email' name='email' placeholder='inserire email' required id='email'></label>
<label id='number-label' for='number'>Valutazione:
<input type='number' placeholder='valutazione' id='number' name='number' min='1' max='10' required></label>
</div>
<p>Cosa ti ha colpito maggiormente 🤯:</p>
<label></label>
<select name="voti" id="dropdown">
<option value="">--Scegli un opzione--</option>
<option value="check-in">Check-in</option>
<option value="pulizia">Pulizia</option>
<option value="accuratezza">Accuratezza</option>
<option value="comunicazione">Comunicazione</option>
<option value="posizione">Posizione</option>
<option value="qualità-prezzo">Qualità-Prezzo</option>
</select>
<div class='gruppo-sondaggio'>
<p>Valutazione del tuo soggiorno 🚀</p>
<label for='dropdown'>Scegli una valutazione:</label>
<select name="voti" id="dropdown">
<option value="">--Scegli un opzione--</option>
<option value="ottima">Ottima</option>
<option value="buona">Buona</option>
<option value="sufficiente">Sufficiente</option>
<option value="insufficiente">Insufficiente</option>
<option value="pessima">Pessima</option>
</select>
</div>
<div class='gruppo-sondaggio'>
<p>Consiglieresti questo appartamento?</p>
<label for='user-recommend'>
<input name='user-recommend' id='user-recommend' value="decisamente si" type="radio" class="input-radio" checked>Decisamente si</label>
<label for='user-recommend'>
<input name="user-recommend" value="decisamente no" type="radio" class="input-radio">Decisamente no</label>
<label for='user-recommend'>
<input name="user-recommend" value="forse" type="radio" class="input-radio">Forse</label>
</div>
<div class='gruppo-sondaggio'>
<p>Cosa miglioreresti nell'appartamento?</p>
<label>
<input name="prefer" value="servixi" type="checkbox" class="input-checkbox"> Servizi
</label>
<label>
<input name="prefer" value="accoglienza" type="checkbox" class="input-checkbox"> Accoglienza
</label>
<label>
<input name="prefer" value="elettrodomestici" type="checkbox" class="input-checkbox"> Elettrodomestici
</label>
<label>
<input name="prefer" value="biancheria" type="checkbox" class="input-checkbox"> Biancheria
</label>
<label>
<input name="prefer" value="mobili" type="checkbox" class="input-checkbox"> Mobili
</label>
</div>
<div class='gruppo-sondaggio'>
<p>Raccontaci la tua esperienza ✈️:</p>
<textarea id='recensione' class'recensione-casa' rows='3' placeholder='la tua esperienza...' name='recensione'>
</textarea>
</div>
<div class='gruppo-sondaggio'>
<button type='submit' class='submit-button' id='submit' name='submit'>Submit 🙌🏻</button>
</div>
</form>
</section>
</body>
</html>
/* file: styles.css */
body {
background-color: grey;
color: white;
margin: 10px;
}
h1 {
text-align: center;
font-family: Georgia;
color: rgb(83, 35, 83);
text-decoration: underline;
}
label {
display: block;
}
#description {
text-align: center;
font-family: Georgia;
font-size: 25px;
padding: 10px;
}
form {
margin: 10px;
padding: 20px 0;
}
#submit {
margin: 20px 50px;
}
#survey-form {
text-align: center;
}
p {
text-decoration: underline
}
#number-label {
padding-right: 68px;
}
Your browser information:
User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36
Challenge Information:
Survey Form - Build a Survey Form