SiddharthManthan · January 10, 2023 14:12
diff --git a/first-form.html b/first-form.html
 <!DOCTYPE html>
 <html lang="en-US">

 <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <title>My test page</title>

    <style>
        form {
            /* Center the form on the page */
            margin: 0 auto;
            width: 400px;
            /* Form outline */
            padding: 1em;
            border: 1px solid #ccc;
            border-radius: 1em;
        }

        ul {
            list-style: none;
            padding: 0;
            margin: 0;
        }

        form li+li {
            margin-top: 1em;
        }

        label {
            /* Uniform size & alignment */
            display: inline-block;
            width: 90px;
            text-align: right;
        }

        input,
        textarea {
            /* To make sure that all text fields have the same font settings
     By default, textareas have a monospace font */
            font: 1em sans-serif;

            /* Uniform text field size */
            width: 300px;
            box-sizing: border-box;

            /* Match form field borders */
            border: 1px solid #999;
        }

        input:focus,
        textarea:focus {
            /* Additional highlight for focused elements */
            border-color: #000;
        }

        textarea {
            /* Align multiline text fields with their labels */
            vertical-align: top;

            /* Provide space to type some text */
            height: 5em;
        }

        .button {
            /* Align buttons with the text fields */
            padding-left: 90px;
            /* same size as the label elements */
        }

        button {
            /* This extra margin represent roughly the same space as the space
     between the labels and their text fields */
            margin-left: 0.5em;
        }

    </style>
 </head>

 <body>
    <form action="/my-handling-form-page" method="post">
        <ul>
            <li>
                <label for="name">Name : </label>
                <input type="text" id="name" name="user_name">
            </li>
            <li>
                <label for="email">E-Mail : </label>
                <input type="email" id="email" name="user_email">
            </li>
            <li>
                <label for="message">Message : </label>
                <textarea id="message" name="user_message"></textarea>
            </li>
            <li>
                <button type="submit">Send</button>
            </li>
        </ul>
    </form>
 </body>

 </html>
	<!DOCTYPE html>
	<html lang="en-US">

	<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width">
	<title>My test page</title>

	<style>
	form {
	/* Center the form on the page */
	margin: 0 auto;
	width: 400px;
	/* Form outline */
	padding: 1em;
	border: 1px solid #ccc;
	border-radius: 1em;
	}

	ul {
	list-style: none;
	padding: 0;
	margin: 0;
	}

	form li+li {
	margin-top: 1em;
	}

	label {
	/* Uniform size & alignment */
	display: inline-block;
	width: 90px;
	text-align: right;
	}

	input,
	textarea {
	/* To make sure that all text fields have the same font settings
	By default, textareas have a monospace font */
	font: 1em sans-serif;

	/* Uniform text field size */
	width: 300px;
	box-sizing: border-box;

	/* Match form field borders */
	border: 1px solid #999;
	}

	input:focus,
	textarea:focus {
	/* Additional highlight for focused elements */
	border-color: #000;
	}

	textarea {
	/* Align multiline text fields with their labels */
	vertical-align: top;

	/* Provide space to type some text */
	height: 5em;
	}

	.button {
	/* Align buttons with the text fields */
	padding-left: 90px;
	/* same size as the label elements */
	}

	button {
	/* This extra margin represent roughly the same space as the space
	between the labels and their text fields */
	margin-left: 0.5em;
	}

	</style>
	</head>

	<body>
	<form action="/my-handling-form-page" method="post">
	<ul>
	<li>
	<label for="name">Name : </label>
	<input type="text" id="name" name="user_name">
	</li>
	<li>
	<label for="email">E-Mail : </label>
	<input type="email" id="email" name="user_email">
	</li>
	<li>
	<label for="message">Message : </label>
	<textarea id="message" name="user_message"></textarea>
	</li>
	<li>
	<button type="submit">Send</button>
	</li>
	</ul>
	</form>
	</body>

	</html>