hidden: true doesn't hide paragraph

Question

<!DOCTYPE html>
<html>
<body>

<p style="hidden: true;" id="demo">Hello!</p>

</body>
</html>

Why doesn't hidden: true; hide the paragraph? I can see it on the web page

@xmaster What is the property "hidden" used for? What are its features? — user11621143, Jun 11 '19 at 09:32
check this [link](https://developer.mozilla.org/en-US/docs/Web/CSS/visibility) — xmaster, Jun 11 '19 at 09:33
@xmaster in that link "hidden" is used as a value, not as a property — user11621143, Jun 11 '19 at 09:34
hidden isn't a property... only a value and in the link you can read everything about it — xmaster, Jun 11 '19 at 09:36
There is no CSS property called `hidden`. There is, though, a universal HTML `attribute` called `hidden`. — connexo, Jun 11 '19 at 09:46
Feel free to delete your question. It is not useful for others — mplungjan, Jun 11 '19 at 09:53

Stefan Joseph · Answer 1 · 2019-06-11T09:34:45.690

1

Try using visibility: hidden; for your style or you can use the hidden attribute like this

<p hidden>Hello!</p>

edited Jun 11 '19 at 09:34

answered Jun 11 '19 at 09:32

Stefan Joseph

What is "hidden: true" used for? – user11621143 Jun 11 '19 at 09:33
You don't use "hidden:true" since it is not a valid html/css property. Instead you use attribute like in the code i have answered or use visibility:hidden in your style – Stefan Joseph Jun 11 '19 at 09:34
Perhaps he meant ` – mplungjan Jun 11 '19 at 09:42
@mplungjan – Stefan Joseph Jun 11 '19 at 09:54
Sure. However hidden="hidden" might work :) Like disabled="disabled" – mplungjan Jun 11 '19 at 09:57
No hidden is an attribute you can't use it like that. Futher reference : https://developer.mozilla.org/en-US/docs/Web/CSS/visibility – Stefan Joseph Jun 11 '19 at 10:01
https://html.spec.whatwg.org/multipage/common-microsyntaxes.html#boolean-attributes – mplungjan Jun 11 '19 at 11:17
"disabled" is something you use when the input type is "checkbox". A checkbox is more like a boolean value of true or false which is why disabled works. You cannot use the same attribute for a p tag which does not have any boolean value rather simply display sting characters – Stefan Joseph Jun 11 '19 at 11:21

GiampaoloGabba · Answer 2 · 2019-06-11T09:42:45.393

0

hidden: true is not a valid css attribute

use:

<p style="display: none;" id="demo">Hello!</p>

this means that the tag will not appear on the page and there will be no space allocated

or:

<p style="visibility: hidden;" id="demo">Hello!</p>

this means that the tag is not visible, but space is allocated for it.

edited Jun 11 '19 at 09:42

answered Jun 11 '19 at 09:33

GiampaoloGabba

2

hidden is a valid HTML attribute - but used as CSS will not work – mplungjan Jun 11 '19 at 09:41

2 Answers2