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

Popular posts from this blog

android - Get AccessToken using signpost OAuth without opening a browser (Two legged Oauth) -

org.mockito.exceptions.misusing.InvalidUseOfMatchersException: mockito -

google shop client API returns 400 bad request error while adding an item -