Sliding doors HTML buttons in Safari Win
- by RyanP13
Hi,
I have the following HTML for buttons implementing sliding doors technique that look fine in everything but Safari on Windows:
<button type="submit">
<span>Button</span>
</button>
This is the corresponding CSS:
button {
background:url("../images/sprBgBtn.png") no-repeat right -47px;
border:0;
cursor:pointer;
font-weight:bold;
height:27px;
line-height:27px;
overflow:visible;
padding:0 26px 0 0;
position:relative;
text-align:center;
text-transform:uppercase;
width:auto;
}
button::-moz-focus-inner {
border: none; /* overrides extra padding in Firefox */
padding:0;
}
button span {
background:url("../images/sprBgBtn.png") no-repeat left top;
display:block;
height:27px;
line-height:27px;
padding:0 0 0 26px;
position:relative;
white-space:nowrap;
}
If i omit the following code then the same issue will appear in FFOX:
button::-moz-focus-inner {
border: none; /* overrides extra padding in Firefox */
padding:0;
}
