Hide or show content
Hidden
Hide content in a non-accessible way. Content is hidden for everybody including screenreaders.
<div class="k-hidden">
...
</div>
Visually hidden
Hide the content in an accessible way. Content is hidden for viewers but not for screenreaders
<div class="k-visually-hidden">
...
</div>
Visually shown
Show content that have the .visually-hidden
class.
- Use as
@extend
for items that are already extending.k-visually-hidden
. - Avoid using
.k-visually-hidden
and.k-visually-shown
classes together.
<div class="k-visually-shown">
...
</div>
Touch events hidden
Hide elements for touch enabled devices
<div class="k-touchevents-hidden">
...
</div>
Need Help?
Let our developers personally assist you. You can ask development related questions in our Support Center. Only for Business or Agency subscribers.