如何在css中添加填充到輸入的外部

Question

每次我嘗試在輸入的外部添加填充時，它只是在佔位符和輸入內部之間添加填充。有誰知道如何解決這一問題？

#ask { 

     padding: 10px 10px 10px 6px; 
     font-size:45px; 
     background-color:#F2F2F2; 
     } 


    <input id="ask" type="text" placeholder = "Ex: How tall is the Gateway Arch" autocomplete="on"/> 

Answer 1

填充它是元素和它的內容之間的空間。也許你應該嘗試保證金。

#ask { 
    margin: 10px 10px 10px 6px; 
    font-size:45px; 
    background-color:#F2F2F2; 
} 

Answer 2

嘗試添加margin而不是padding。

https://jsfiddle.net/Lw4d1ghs/

邊距改變元素外的空間，填充在其內改變的空間。 https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Box_Model/Introduction_to_the_CSS_box_model

Answer 3

你爲什麼不使用邊距：

這些規則是由CSS 盒模型管轄？ 在你的情況下是這樣的： margin：10px 10px 10px 6px;

填充始終清除元素內容周圍的區域。 http://www.w3schools.com/css/css_padding.asp 邊距用於清除元素周圍的區域。 http://www.w3schools.com/css/css_margin.asp