HTML Code

<!DOCTYPE html>

<html lang="en">

<head>

  <meta charset="UTF-8">

  <title>Fieldset form</title>

  <style>

    form { max-width: 420px; }

    label { font-weight: 600; }

    fieldset { border: 1px solid #e2e8f0; border-radius: 8px; padding: 16px; margin-bottom: 16px; }

    legend { font-weight: 600; padding: 0 4px; }

    .inline label { font-weight: normal; margin-right: 16px; }

    button { background: #2563eb; color: #fff; border: none; padding: 10px 20px; border-radius: 6px; cursor: pointer; }

  </style>

</head>

<body>

  <h1>Survey</h1>

  <form>

    <fieldset>

      <legend>Experience level</legend>

      <input type="radio" id="beginner" name="level" value="beginner">

      <label for="beginner" class="inline">Beginner</label>

      <input type="radio" id="advanced" name="level" value="advanced">

      <label for="advanced" class="inline">Advanced</label>

    </fieldset>



    <p class="inline">

      <input type="checkbox" id="newsletter" name="newsletter" value="yes">

      <label for="newsletter">Email me updates</label>

    </p>



    <button type="submit">Send survey</button>

  </form>

</body>

</html>

Lines: 0 | Characters: 0

Live Preview Auto-refresh on Run

HTML Form — Fieldset and Choices