CSS元素在Safari中低於預期位置

我有一個問題，我使用的顏色塊就像一個按鈕，它很好地位於Firefox和IE中，但由於Safari的某些原因，坐在下面我希望坐的位置見圖）。CSS元素在Safari中低於預期位置

enter image description here

任何指針，以什麼我做錯了會，因爲我已經與這擺弄一段時間，似乎無法得到它的工作是極大的讚賞（？）

的（我的想法是）相關的CSS是：

//the element that represents the button that is floating 
//too low in safari: 

#addplacebtn { 
text-align: center; 
margin-top: 0em; 
margin-bottom: 0em; 
display: inline-block; 
width: 35px; 
float: right; 
background-color: #226083; 

} 

//the element that is containing the problematic element 

#edit-addplacebtn { 
height: 45px; 
width: 35px; 
top: 5px; 

} 

//the element containing the above element 

.tbrow { 
height: 35px; 
width: 285px; 
margin-bottom: 5px; 
margin-top: 5px; 
}

來源

2012-04-26 Rowan

你的Html代碼是什麼？ – 2012-04-26 11:12:18

張貼在jsfiddle – 2012-04-26 11:51:39

我的猜測是，由於某種原因，該按鈕不太適合你留下的差距。除此之外，'＃addplacebtn'上的'display：inline-block;'和'float：right;'都是。 'float'意味着'display'將不起作用。也許試試'float：left;'？另外，除非你已經定位了'＃edit-addplacebtn'，'top'將不起作用。 – 2012-04-26 14:22:46

首先，您可以嘗試將位置設置爲絕對。這將確保它將堅持一個位置。

position:absolute;

其次，而不是保證金，你應該嘗試左和頂。因爲所有瀏覽器都不相同。

left: 400px; 
top: 350px;

這是一個很大的努力，並咒罵得到他們應在儘可能多的瀏覽器中的元素，它只是:)

我希望這有助於！ :)

ps。（對不起英語，我希望你能理解我xD）

來源

2012-04-26 11:17:34

請注意，使用position：absolute;在子元素上需要位置：相對;在父親 – 2012-04-26 11:50:49

我可以讓按鈕坐在同一行，但只有當我減少寬度爲30px。我試圖編輯容器的寬度和元素本身，儘管看起來有足夠的空間讓元素適合它，但在Safari中無法使用。然而，我還沒有嘗試過絕對的位置。我注意到+符號的字體大小是30px。林想知道如果這只是一個巧合（？） – Rowan 2012-04-28 06:52:49

嗯，我在響應式網站中得到了完全相同的問題。我想知道我是否寫下「位置：絕對的」會使網站的響應速度停止在這些項目上工作？ – viriato 2014-12-04 12:08:27

CSS元素在Safari中低於預期位置

回答

相關問題