2

I have the following button: 

<button id="=" style=width:150px;height:150px;font-size:100px; onclick="equalFunction()" disabled="true">=</button>

however in the disabled="true" my IDE recognizes the "true" value to be the "wrong attribut value" does anyone know how to solve this? The code still works, its just annoying to see it be highlighted.

node_modules
  • 4,790
  • 6
  • 21
  • 37
Anonberg
  • 41
  • 6
  • 1
    It should be `disabled="disabled"` or `disabled` – node_modules Aug 03 '18 at 20:08
  • HTML working and HTML being correct are, unfortunately, fairly different things. Browsers will pretty much try to render anything you throw at them, regardless of strict correctness. – Silvio Mayolo Aug 03 '18 at 20:09
  • See: https://stackoverflow.com/questions/6961526/what-is-the-correct-value-for-the-disabled-attribute –  Aug 03 '18 at 20:13

2 Answers2

3

You don't need to set it to true. Do something like this:

<button id="=" style=width:150px;height:150px;font-size:100px; onclick="equalFunction()" disabled>=</button>
Brian
  • 823
  • 6
  • 14
2

According to the HTML5 spec:

A number of attributes in HTML5 are boolean attributes. The presence of a boolean attribute on an element represents the true value, and the absence of the attribute represents the false value.

If the attribute is present, its value must either be the empty string or a value that is a case-insensitive match for the attribute's canonical name, with no leading or trailing whitespace.

So with a boolean attribute like disabled, it's presence alone is enough and it needs no value, although virtually every web browser will still accept it. Therefore, you should use either disabled (alone) or disabled="disabled"

j08691
  • 204,283
  • 31
  • 260
  • 272