Page Title
body {
font-family: Arial;
margin: 0;
}
/* Header */
.Saurabh{
padding: 60px;
text-align: center;
background: blue;
color: yellow;
font-size: 30px;
}
.topnav {
overflow: hidden;
background-color: #e9e9e9;
}
.topnav a {
float: left;
display: block;
color: black;
text-align: center;
padding: 14px 16px;
text-decoration: none;
font-size: 17px;
}
.topnav a:hover {
background-color: #ddd;
color: black;
}
.topnav a.active {
background-color: #2196F3;
color: white;
}
.topnav .search-container {
float: right;
}
.topnav input[type=text] {
padding: 6px;
margin-top: 8px;
font-size: 17px;
border: none;
}
.topnav .search-container button {
float: right;
padding: 6px 10px;
margin-top: 8px;
margin-right: 16px;
background: #ddd;
font-size: 17px;
border: none;
cursor: pointer;
}
.topnav .search-container button:hover {
background: #ccc;
}
@media screen and (max-width: 600px) {
.topnav .search-container {
float: none;
}
.topnav a, .topnav input[type=text], .topnav .search-container button {
float: none;
display: block;
text-align: left;
width: 100%;
margin: 0;
padding: 14px;
}
.topnav input[type=text] {
border: 1px solid #ccc;
}
}
/* Page Content */
.content {padding:20px;}
footer {
text-align: center;
padding: 3px;
background-color: #FFEC30;
color: white;
}
.fa {
padding: 20px;
font-size: 30px;
width: 30px;
text-align: center;
text-decoration: none;
margin: 5px 2px;
border-radius: 50%;
}
.fa:hover {
opacity: 0.7;
}
.fa-facebook {
background: #3B5998;
color: white;
}
.fa-twitter {
background: #55ACEE;
color: white;
}
.fa-google {
background: #dd4b39;
color: white;
}
.fa-linkedin {
background: #007bb5;
color: white;
}
.fa-youtube {
background: #bb0000;
color: white;
}
form {
border: 3px solid #f1f1f1;
font-family: Arial;
}
.container {
padding: 20px;
background-color: #f1f1f1;
}
input[type=text], input[type=submit] {
width: 100%;
padding: 12px;
margin: 8px 0;
display: inline-block;
border: 1px solid #ccc;
box-sizing: border-box;
}
input[type=checkbox] {
margin-top: 16px;
}
input[type=submit] {
background-color: #04AA6D;
color: white;
border: none;
}
input[type=submit]:hover {
opacity: 0.8;
}
.calculator {
color: black;
background-color: #242424;
width: 300px;
margin: 0 auto;
}
input[type=”text”] {
width: 100%;
font-size: 20px;
padding: 10px;
color: white;
}
table {
width: 100%;
}
td {
text-align: center;
padding: 10px;
}
.btn {
width: 60px;
height: 60px;
font-size: 20px;
cursor: pointer;
color: white;
}
CALCULATOR
| C | 7 | 8 | 9 | + |
| 4 | 5 | 6 | – | |
| 1 | 2 | 3 | * | |
| 0 | . | = | / |
function appendToDisplay(value) {
document.getElementById(“display”).value += value;
}
function clearDisplay() {
document.getElementById(“display”).value = ”;
}
function calculateResult() {
try {
document.getElementById(“display”).value = eval(document.getElementById(“display”).value);
} catch (error) {
document.getElementById(“display”).value = ‘Error’;
}
}
div class=”Saurabh”>
Saurabh Sahu
this calculator is made by Saurabh Sahu .
please appreciate his work and share this website to your friends and family.
currently this website is in developing stage