Search code examples
cssfont-sizeinput-field

Change font size inside input-fields with css

html{
	font-size:62.5%;
}

body{
	font-family:arial;
	font-size:1.1rem;
}
<p>LOREM IPSUM</p>
<p>LOREM IPSUM</p>

<input type = 'text' value = 'LOREM IPSUM'>

Why doesn’t font-size:1.1rem work inside input-fields?

How to get a global font-size for the entire page?

Solution

  • The input fields are not effected by font variations you make for the body element. You have to style them separately.

    To change that, use

    input[type=text] {
    font-size: inherit;
}