javascript - CSS class with colon -
i'm using topcoat css library. can see code snippet i'm having problems here.
in stylesheet, there following put red border around input when invalid:
.topcoat-text-input--large:invalid { border: 1px solid #ec514e; }
my html is:
<input type="text" class="topcoat-text-input--large" id="email" placeholder="email" value="<%= model.email %>">
how set input use css invalid? if change class of input from:
topcoat-text-input--large
to
topcoat-text-input--large:invalid
i don't red border. idea's how use css?
the :invalid
pseudo-class triggered when pattern
input attribute not matched.
in linked example:
<input type="text" class="topcoat-text-input--large" placeholder="text" value="fail" pattern="not-fail">
if type "not-fail" box, turn blue. if type else, not match pattern
, invalid
.
for more information, see mdn article on pattern
.
a regular expression control's value checked against. pattern must match entire value, not subset. use title attribute describe pattern user. attribute applies when value of type attribute text, search, tel, url or email; otherwise ignored. regular expression language same javascript's. pattern not surrounded forward slashes.
Comments
Post a Comment