Tell us what’s happening:
My form is inline-block. I want to get it to block but is unsuccessful. What do I do wrong?
Your code so far
<!-- file: index.html -->
<!DOCTYPE HTML>
<head>
<title>Church Survey Form</title>
<meta charset="utf-8"/>
<link ref="styles.css" rel="stylesheet" />
</head>
<body>
<h1 id="title"> Regarding your visit to our church</h1>
<p id="description"> This survey is comducted to find out why you visit our church.</p>
<form action="http:newcreation.org.sg" id="survey-form" method="post">
<fieldset>
<label for="name">Your Name: <input id="name" type="text" required placeholder="Your Name:"/></label>
<label for="email">Your E-mail: <input id="email" type="email" placeholder="Your Email" required /></label>
<label for="number"> Your Age: <input id="number" type="number" min="12" max="120" required placeholder="Your Age"/></label>
</fieldset>
<fieldset>
<label id="name-label" for "church"> Your church Name:<input id="church" type="text" /></label>
<label id="email-label" for "cmail">Your Church Email:<input id="cmail" type="text"/></label>
<label id="number-label" for="cnum"> Your Church Number: <input id="cnum" type="number" /></label>
</fieldset>
<fieldset><label for="dropdown">How do you come to visit us?<select id="dropdown">
<option value="">select one</option>
<option value="1">Through Friends</option>
<option value="2">Visit Myself</option>
</select></label>
Will you visit again? <label for="Yes"> Yes <input type="radio" name="Yes No" /></label for="No"> No<input type="radio" name="Yes No" /> </label>
</fieldset>
</form>
/* file: styles.css */
body {
width: 100%;
height: 100vh;
margin: 0;
background-color: #1b1b32;
color: #f5f6f7;
}
label {
display: block;
margin: 0.5rem 0;
}
Your browser information:
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/110.0.0.0 Safari/537.36
Challenge: Survey Form - Build a Survey Form
Link to the challenge: