Skip to content

Instantly share code, notes, and snippets.

@xfry

xfry/calculator.html

Last active October 28, 2020 22:40
Show Gist options
  • Save xfry/a96a2df2bebaaa235b70c73e48ddc8f0 to your computer and use it in GitHub Desktop.
Save xfry/a96a2df2bebaaa235b70c73e48ddc8f0 to your computer and use it in GitHub Desktop.
Download ZIP
an-calculator-markup
Raw
calculator.html
<!DOCTYPE html>
<head>
<title>Calculator</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="container card-design">
<header>
<h1>Funny Calc</h1>
</header>
<section class="math-box">
<input type="text" class="math-display" value="0">
</section>
<section class="keyboard">
<button class="keys" id="9">9</button>
<button class="keys" id="8">8</button>
<button class="keys" id="7">7</button>
<button class="keys" id="6">6</button>
<button class="keys" id="5">5</button>
<button class="keys" id="4">4</button>
<button class="keys" id="3">3</button>
<button class="keys" id="2">2</button>
<button class="keys" id="1">1</button>
<button class="keys" id="0">0</button>
<button class="keys" id="equal">=</button>
</section>
<section class="keyboard ops">
<button class="keys" id="add">+</button>
<button class="keys" id="diff">-</button>
<button class="keys" id="div">/</button>
<button class="keys" id="mult">*</button>
</section>
</div>
<script src="code.js"></script>
</body>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment