CSS action pseudo classes

Without JavaScript, dynamic UI is possible with just CSS action class selectors. Case study Help text for input element which is only visible when the input is focused. The HTML <div class="input-cont"> <input type="text" placeholder="Focus me" autofocus /> <span class="help" data-help="Enter your email"></span> </div> To achieve the above, a span holding the help text in a data-help attribute as a sibling to the actual input. Both the input and the span are children to a parent div with class name input-cont....

June 13, 2021 · 3 min · Aleem Isiaka