About This HTML Issue
A CSS validation error about “Too many values or values are not recognized” indicates that a CSS property in your HTML uses an invalid or unsupported value, or has more values than expected.
CSS properties have strict rules regarding which values and how many values they accept. Using an unsupported keyword, a typo, or an extra value will result in validation errors. For example, the color property only accepts valid color values (like red, #f00, rgb(255,0,0)), but not unrelated keywords. Similarly, margin can accept one to four length or percentage values, but adding a fifth value or invalid text will cause an error.
Example of INVALID CSS:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Invalid CSS Example</title>
<style>
p {
color: red blue; /* Too many values */
margin: 10px 20px 5px 0px 15px; /* Too many values */
display: blocky; /* Unrecognized value */
}
</style>
</head>
<body>
<p>Hello, world!</p>
</body>
</html>Example of VALID CSS:
<!DOCTYPE html>
<html lang="en">
<head>
<title>Valid CSS Example</title>
<style>
p {
color: red;
margin: 10px 20px 5px 0px;
display: block;
}
</style>
</head>
<body>
<p>Hello, world!</p>
</body>
</html>Check each CSS property for correct spelling, valid values, and valid value count.
Learn more:
Last reviewed: May 08, 2025
Find issues like this automatically
Rocket Validator scans thousands of pages in seconds, detecting HTML issues across your entire site.