I would like to know why the span and input have different padding even if I set it the same. It behaves the same in Firefox and Chrome. Which CSS rule affects this?
span, input {
font-family: sans-serif;
font-size: 11pt;
font-weight: 400;
line-height: 16pt;
padding: 15px;
border: 1px solid black;
}<span>Some text</span>
<input type="text">>Solution :
line-height doesn’t affect span because it is "inline" by default and input is inline-block by default. So if you set for span display: inline-block it should work
span, input {
font-family: sans-serif;
font-size: 11pt;
font-weight: 400;
line-height: 16pt;
padding: 15px;
border: 1px solid black;
display: inline-block; /* << here */
}<span>Some text</span>
<input type="text">