在safari中選擇下拉文本對齊中心？

Question

選擇下拉CSS

display: block; 
height: 60px; 
margin-left: 10%; 
margin-right: 10%; 
margin-top: 10px; 
min-height: 60px; 
text-align: center; 

選項文本居中在Firefox瀏覽器，但不是在野生動物園， 是否有任何解決方案，使在Safari瀏覽器中居中對齊文本？

Answer 1

添加填充並刪除高度。例如這裏是代碼的更新您所提供的：

display: block; 
margin-left: 10%; 
margin-right: 10%; 
margin-top: 10px; 
padding-top: 10px; 
padding-right: 20px; 
padding-bottom: 10px; 
padding-left: 20px; 

UPDATE

不幸的是填充可能無法在Safari瀏覽器（iPhone）工作。在這種情況下，請嘗試使用文本縮進而不是填充。並添加下拉菜單寬度的文本縮進。請參閱您提供的代碼更新：

display: block; 
height: 60px; 
margin-left: 10%; 
margin-right: 10%; 
margin-top: 10px; 
min-height: 60px; 
width: 220px; /* width of 200px plus the 20px for the text indent */ 
text-indent: 20px; 

Answer 2

您可以使用頂部和底部填充並移除高度以對齊中間的文本。

padding: 30px;