HTML Form
Home
Snippets
HTML Form
HTML
CSS
JS
<form> <fieldset> <legend>Email *</legend> <input type="email" /> </fieldset> <fieldset> <legend>Your Full Name *</legend> <input type="text" /> </fieldset> </form>
* { box-sizing: border-box; padding: 0; margin: 0; font-size: 11px; } body { height: 100vh; display: flex; align-items: center; justify-content: center; font-family: sans-serif; color: #fff; text-shadow: 0 1px 2px #000; background-color: #333; } form { box-shadow: 0 0 10px #000; padding: 30px 20px 35px 20px; border-radius: 10px; display: flex; flex-direction: column; gap: 2rem; } input { padding: 0.5em 1em; border: 0; background-color: transparent; color: #fff; font-size: 1.2em; width: 220px; } input:focus { outline: 0; } fieldset { padding: 0; border: 2px solid #fff; border-radius: 4px; } fieldset:focus-within { border-color: #b02727; } legend { margin-left: 0.75em; padding-inline: 0.5em; font-size: 1.25em; }
//javascript
Ad #1
Ad #2
Scroll to Top