Why isn't the line-height property vertically center-aligning text in my button as expected?
In Firefox, Opera, and Safari, the text appears to be bottom-aligned.
Here is a link to my JSFiddle demonstration.
<button class="get_discount_rate">Button</button>
button {
font-family: Arial, Helvetica, sans-serif;
font-weight: normal;
color: #444;
min-width: 90px;
height: 24px;
line-height: 24px;
margin: 5px 10px;
background-color: #fdfdfd;
border: 1px solid #cdcdcd;
cursor: pointer;
border-radius: 3px;
}