csshtmltwitter-bootstrap

Difference between disabled class of bootstrap and disabled attribute


Hi friends i am using disabled class as well as disabled attribute as follows however i dont know the basic difference between both and when we have to use class and when to use attribute please clear my doubt I am using button in my code and i want to disable it so what will be the best way either use class disabled or attribute disabled

    <button class="btn btn-primary disabled" type=" button"/>
    disabled="disabled"

Solution

  • If you look at the bootstrap definitions the disabled styles are always defined for the presence of the disabled class or the disabled attributed:

    .btn.disabled,
    .btn[disabled],
    fieldset[disabled] .btn {
        cursor: not-allowed;
        ...
    }
    

    So for styling you only need either class or the attribute.

    Previous versions also included pointer-events: none; which disabled mouse clicks on the button. Here setting either the disabled class or attribute effectively disabled the button.

    In the current version 3.3.5 the pointer-events: none; was dropped from .btn. Then if you only use the class, the button looks disabled but still can be clicked.

    Therefore I would use the disabled attribute for buttons.