Question

Can we hide a glyphicon icon like this,

<i class="glyphicon glyphicon-remove-circle" 
         title="Insert an appropriate value" id="author" hidden="hidden"></i> 
<p>Author</p>
Was it helpful?

Solution

Yes you can, but using ONLY hidden will be an invalid attribute, so use data-hidden="hidden" as it's valid to create custom attributes as of HTML5, but they should've data- prefix.

And then in your CSS, you can write..

[data-hidden="hidden"] {
   display: none; /* OR */
   visibility: hidden; /* If you want to reserve space */
}

Demo


If you are damn sure that you will be using this to hide elements, and ONLY hide, than consider using !important so that specificity doesn't trouble you.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top