<div class="buttons">
<button type=button>
Button
</button>
<button type=button class="button">
Button
</button>
</div>
body {
display: flex;
margin: 0;
overflow: hidden;
}
.buttons {
align-items: center;
display: flex;
height: 100vh;
justify-content: space-around;
margin: 0 auto;
width: 50%;
}
.button {
background-color: #005797;
border: solid 2px #005797;
border-radius: 1.5rem;
color: #fff;
font-size: 0.875rem;
font-weight: 600;
line-hegiht: 1.5;
padding: 0.6875rem 1.5rem;
}
.button:hover {
background-color: #024488;
border-color: #024488;
}
.button:focus, .button:active {
background-color: #f9dc4a;
border-color: #000;
color: #000;
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.