<form>
<fieldset>
<legend>User Data</legend>
<label>
First Name
<input type="text" name="name">
</label>
<br>
<label>
Last Name
<input type="text" name="surname">
</label>
</fieldset>
<fieldset>
<legend>Delivery method</legend>
<label>
Courier
<input type="radio" name="delivery" value="courier">
</label>
<br>
<label>
Pickup
<input type="radio" name="delivery" value="pickup">
</label>
</fieldset>
<button>Order</button>
</form>
xxxxxxxxxx
body {
padding: 20px;
color: #1e1f26;
font: 18px/1.5 sans-serif;
}
form {
width: 300px;
}
fieldset {
margin: 0 0 20px;
padding: 20px 15px;
border: 1px solid #ae63e4;
}
button {
padding: 10px 24px;
border: none;
border-radius: 7px;
color: #fff;
font-weight: bold;
background: #47cf73;
cursor: pointer;
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.