HTML5's hidden attribute is perfectly suitable for hiding elements that are made invisible by states.js based on #states.

When specified on an element, it indicates that the element is not yet, or is no longer, relevant. User agents should not render elements that have the hidden attribute specified.


This attribute is supported by all browsers but IE. We can however easily fix it for IE using some CSS

*[hidden] {
  display: none;

@jacine thanks!

Just note that we should be aware of:

The hidden attribute must not be used to hide content that could legitimately be shown in another presentation. For example, it is incorrect to use hidden to hide panels in a tabbed dialog, because the tabbed interface is merely a kind of overflow presentation

Component:base system» javascript

#states is JS

Issue tags:-html5