├── index.html └── style.css /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | FD Interest Calculator 7 | 8 | 9 | 10 | 11 |
12 | 13 |

FD Interest Calculator

14 |
15 | 16 |
17 |
18 | 19 |
20 |
21 | 22 |
23 |
24 | 41 | 42 | -------------------------------------------------------------------------------- /style.css: -------------------------------------------------------------------------------- 1 | html, 2 | body{ 3 | margin: 0; 4 | font-family: 'Poppins', sans-serif; 5 | background-color:#badef5; 6 | } 7 | 8 | #wrapper div,#wrapper h2{ 9 | display:flex; 10 | justify-content: center; 11 | 12 | } 13 | 14 | h2{ 15 | color:#a7e2ff; 16 | letter-spacing: 1px; 17 | } 18 | input{ 19 | border-radius: 5px; 20 | border: 2px solid black ; 21 | margin-top:30px; 22 | height:2em; 23 | width:250px; 24 | padding-left:10px; 25 | } 26 | 27 | input:active{ 28 | border:none; 29 | } 30 | #wrapper{ 31 | height:450px; 32 | width:400px; 33 | margin:200px auto; 34 | background-color:#0d1669; 35 | border-radius:10px; 36 | padding:20px; 37 | } 38 | 39 | button{ 40 | margin-top:20px; 41 | background-color:#a7c4ff; 42 | border-radius: 4px; 43 | height: 44px; 44 | font-weight: 600; 45 | padding: 0 30px; 46 | letter-spacing: 1px; 47 | border: none; 48 | color: #102770; 49 | } 50 | 51 | button:hover{ 52 | cursor:pointer; 53 | } 54 | #result{ 55 | color:white; 56 | margin-top:20px; 57 | font-size:1.2em; 58 | } 59 | 60 | 61 | 62 | --------------------------------------------------------------------------------