wibowoow

style.css (web calkulator)

Oct 24th, 2020
706
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. *{
  2.     box-sizing: border-box;
  3. }
  4.  
  5. body{
  6.     font-family: sans-serif;
  7. }
  8.  
  9. .flex-container-column{
  10.     display: flex;
  11.     flex-direction: column;
  12.  
  13.     /*properti pendukung*/
  14.     max-width: 800px;
  15.     margin: 0 auto;
  16.     text-align: right;
  17. }
  18.  
  19. .flex-container-row{
  20.     display: flex;
  21. }
  22.  
  23. .button{
  24.     flex-basis: 25%;
  25.  
  26.     /*properti pendukung*/
  27.     font-size: 1.5em;
  28.     text-align: center;
  29.     padding: 40px;
  30.     border: 1px solid black;
  31.     background: -webkit-linear-gradient(top, #d2d2d2, #ddd);
  32.     cursor: pointer;
  33.  
  34. }
  35.  
  36. .double{
  37.     flex-basis: 50%;
  38. }
  39.  
  40. .display{
  41.     color: white;
  42.     width: 100%;
  43.     padding: 10px 20px;
  44.     background-color: #333333;
  45.     border: 1px solid black;
  46.     font-size: 2em;
  47. }
  48.  
  49. .operator,
  50. .negative,
  51. .equals{
  52.    background: orange;
  53. }
  54.  
  55. .card{
  56.     box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
  57.     border-radius: 5px;
  58.     padding: 30px;
  59.     margin-top: 20px;
  60. }
  61.  
  62. .button:hover{
  63.     font-weight: bold;
  64.     background: red;
  65. }
  66.  
  67. @media screen and (max-width: 513px){
  68.     .button{
  69.         padding: 10px;
  70.     }
  71. }
  72.  
  73.  
RAW Paste Data