CSS Button Classes

Date: 2021-03-06
.btn-group {
    display: grid;
    padding: 0.4rem;
    gap: 0.4rem 0.4rem;
    grid-template-columns: repeat(auto-fit, 140px);
    border-radius: 2px;
}

.my-button {
    cursor: pointer;
    user-select: none;
    display: inline-grid;
    justify-content: center;
    align-content: center;
    /* configure parameters */
    padding:7px 15px;
    border-radius: 5px;
    background-color: #2090ff;
    font-family:Arial;
    color: #fff;
}
.my-button:hover,
.my-button:focus { filter: brightness(0.8); } 
.my-button:active { filter: brightness(0.7); } 
<div class="btn-group">
  <div class="my-button">Open</div>
  <div class="my-button">Edit</div> 
  <div class="my-button" style="background-color:red">Remove</div>
<div>
46860cookie-checkCSS Button Classes