HTML Form Design using CSS

Web Development
Norbert BM0

Starter HTML for live stream.

In this coding live stream I go through my thought processes of designing a html form.

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />

    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <!-- <link rel="stylesheet" href="style.css" /> -->
    <title>Document</title>
  </head>
  <body>
    <h1>Compound Interest Calculator</h1>
    <form id="CompoundInterestCalculator">
      <input
        type="number"
        id="InitialBalance"
        placeholder="Initial Balance $"
      />
      <input type="number" id="InterestRate" placeholder="Interest Rate %" />
      <input type="number" id="Years" placeholder="Years" />
      <input
        type="number"
        id="MonthlyContribution"
        placeholder="Monthly Contribution $"
      />
      <button type="submit">Calculate</button>
    </form>
    <h4 id="Result"></h4>
    <script src="script.js"></script>
  </body>
</html>

Check out the complete YouTube live stream

Also check out the follow up Tutorial on Compound interest calculator

For the complete article on this subject, go to the blog post by visiting this link:

Build a Compound Interest Calculator –

Also watch the complete video tutorial on YouTube for more information

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.