push a button

Here is the best simple way.

button {
    width: 240px;

    color: var(--background-color-1);
    cursor: pointer;
    text-align: center;
    text-transform: uppercase;
    font-size: 16px;

    position: absolute;
    top: 19vw;
    left: 50%;
  
    border: none;
    backface-visibility: hidden;
    
    padding: 16px 12px;
    z-index: 1;
}
button:before {
    content: "";
    width: 100%;
    height: 100%;
    display: block;
    background-color: red;
    transition: all .3s;
    filter: drop-shadow(0 0 15px yellow);
    animation: bounce 1s infinite alternate;
    position: inherit;
    top: 0;
    left: 0;
    z-index: -1;
}
 
@keyframes bounce {
   to { 
       transform: scale(1.1); 
       filter: drop-shadow(0 0 0 yellow);
    }
}
    
<button>Button Name</button>

CLICK HERE to find out more related problems solutions.

Leave a Comment

Your email address will not be published.

Scroll to Top