Change pattern for input-validation using CSS instead of inline

Question

I have an URL input <input id="my_input" type = "email> and I want to change the pattern attribute. I don't want to do that inline but using the following CSS file

#my_input{
pattern:".*test.*"
}

I get a "unknown property: pattern"

Friedrich -- Слава Україні · Accepted Answer · 2024-08-15 04:55:29Z

1

The pattern attribute is a HTML attribute not a CSS property. Here is an example:

<input type="text" pattern="[a-z]{4,8}" title="4 to 8 lowercase letters">

HTML attributes must be provided inline and cannot be provided in external CSS files.

It is important to note that the HTML attribute if very limited, and it it more common to use JavaScript for input validation due to its broader functionality.

For more information read the MDN docs

edited Aug 15, 2024 at 4:55

Friedrich -- Слава Україні

4,0481 gold badge34 silver badges53 bronze badges

answered Apr 9, 2021 at 6:21

HackerMan

2552 silver badges13 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Change pattern for input-validation using CSS instead of inline

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related