html { height: 100%; } body { background: radial-gradient(ellipse at center, rgba(55,178,230,1) 20%,rgba(0,157,223,1) 100%); } .button { color: #fff; font-family: sans-serif; font-weight: bold; text-align: center; text-decoration: none; text-transform: uppercase; line-height: 50px; position: relative; display: block; height: 50px; width: 200px; margin: 5% auto; border: 1px solid #fff; } .button span, .button i { display: inline-block; z-index: 100; } .button i { font-style: normal; } .backgroundHover { position: absolute; top: 0; left: 0; height: 100%; width: 100%; } .backgroundHover { z-index: -1; background: #fff; }