is there a way I can style this form nicely without putting an id to every label and input to move them separately. tried it with flexbox but couldn’t target them specifically.
obviously happy to receive some fun looking form styling tips ![]()
<form className="quoteform" onSubmit={handleSubmit}>
<label id="firstname">
First Name:{" "}
<input
id="firstname"
type="text"
name="firstName"
value={inputs.firstName || ""}
onChange={handleChange}
/>
</label>
<label id="lastname">
Last Name:
<input
id="lastname"
type="text"
name="lastName"
value={inputs.lastName || ""}
onChange={handleChange}
/>
</label>
<label id="email">
Email Address:
<input
id="email"
type="text"
name="email"
value={inputs.email || ""}
onChange={handleChange}
/>
</label>
<label>
Property Address:
<input
type="text"
name="address"
value={inputs.address || ""}
onChange={handleChange}
/>
</label>
<p>Property Size</p>
<label>
Bed rooms
<input
type="text"
name="beds"
value={inputs.beds || ""}
onChange={handleChange}
/>
</label>
<label>
Bathrooms
<input
type="text"
name="bathrooms"
value={inputs.bathrooms || ""}
onChange={handleChange}
/>
</label>
<br />
<br />
<input type="submit" />
</form>
