Safari瀏覽器6.0的問題是推動CSS定位向左

Question

好吧，這是我有，但盡我所能，使其聽起來不那麼局部的，因爲這實際上可能是與Safari瀏覽器的一個問題...

在我的網站http://s361608839.websitehome.co.uk/101d/html_new/index.html我們有一個按鈕樣式爲ozo_button與btn_arrow_right看起來在它的內部跨度是在遠離野生動物園這樣所有的瀏覽器正確的形式：

是什麼原因造成的CSS使按鈕在Safari 6.0中看起來像這樣（下面），箭頭在文本後面？

HTML：

<a class="ozo_button" href="https://console.101distribution.com?v=register" style="width:200px;cursor:pointer;"><span class="btn_arrow_right ozo_button_icon">icon</span><span class="ozo_button_label">Sign-Up &amp; Get Started</span></a> 

CSS：

a.ozo_button { 
font-family: Verdana; 
font-weight: bold; 
font-size:13px; 
width:75px; 
text-decoration:none; 
display:block; 
padding:5px 15px 5px 0px; 
border:1px solid #999999; 
text-align:center; 
-moz-border-radius:5px; 
-webkit-border-radius:5px; 
-o-border-radius:5px; 
border-radius:5px; 
color:#333; 
border:1px solid #DDD; 
background:#FFFFFF; 
background:-webkit-gradient(linear, 0% 0%, 0% 100%, from(#FFFFFF), to(#EEE)); 
background:-moz-linear-gradient(0% 90% 90deg, #EEE, #FFF); 
-webkit-transition: all .2s ease-in-out; 
-moz-transition: all .2s ease-in-out; 
-o-transition: all .2s ease-in-out; 
transition: all .2s ease-in-out; 
} 

a.ozo_button span.ozo_button_icon { 
vertical-align:middle; 
margin-left: 0px; 
float: left; 
} 
a.ozo_button span.ozo_button_label{ 
vertical-align:middle; 
padding-left:25px; 
} 
.btn_arrow_right{ 
text-indent:-9999px; 
position:absolute; 
height: 35px; 
width: 35px; 
background:url(../images/arena_sprite.png) -263px -80px no-repeat transparent; 
float: left; 
} 

Answer 1

嘗試display:inline-block;或display:block;根據需求還可以使用float:left;如果您正在使用display:block;