對齊文本

Question

我有一個簡單：

<input type="text" placeholder="search .." value="" id="search"/> 

我只是增加了一些CS的規則，如：

#search{ 
padding:2%; 
text-indent:1%; 
width:30%; 
} 

但是當我嘗試在不同的瀏覽器，如FF相同的輸入/鉻我看到somenthing錯誤，例如在鉻中輸入內的文本行高是不同的，並且佔位符仍然保持當焦點在輸入內，而在FF上都是好的，當我關注內部輸入時，佔位符淡出......任何好的規則/規則來修復所有（幾乎所有）行高和文本縮進以及佔位符淡出b rowsers？

Answer 1

這是Chrome中的一項功能，佔位符文本不會在焦點上消失，而只會在輸入中消失。如果你想覆蓋它，你需要使用JavaScript（幾乎打敗了placeholder的想法）。

行高不會被您公開的任何設置所改變。由於不同的默認值，它可能因瀏覽器而異。

text-indent屬性僅適用於塊容器。要在左側設置間距（這似乎是此處的想法），請使用padding-left，最好使用em單位。使間距取決於元素的寬度並不健壯，特別是如果該寬度設置爲相對於可用寬度。