UNPKG

carbon-components

Version:

The Carbon Design System is IBM’s open-source design system for products and experiences.

36 lines (34 loc) 1.53 kB
<!-- Copyright IBM Corp. 2016, 2018 This source code is licensed under the Apache-2.0 license found in the LICENSE file in the root directory of this source tree. --> <div class="bx--tooltip--definition bx--tooltip--a11y" data-tooltip-definition> <button aria-describedby="example-start" class="bx--tooltip__trigger bx--tooltip--a11y bx--tooltip__trigger--definition bx--tooltip--bottom bx--tooltip--align-start"> Definition Tooltip (start aligned) </button> <div class="bx--assistive-text" id="example-start" role="tooltip">Brief description of the dotted, underlined word above.</div> </div> <br> <div class="bx--tooltip--definition bx--tooltip--a11y" data-tooltip-definition> <button aria-describedby="example-center" class="bx--tooltip__trigger bx--tooltip--a11y bx--tooltip__trigger--definition bx--tooltip--bottom bx--tooltip--align-center"> Definition Tooltip (center aligned) </button> <div class="bx--assistive-text" id="example-center" role="tooltip">Brief description of the dotted, underlined word above.</div> </div> <br> <div class="bx--tooltip--definition bx--tooltip--a11y" data-tooltip-definition> <button aria-describedby="example-end" class="bx--tooltip__trigger bx--tooltip--a11y bx--tooltip__trigger--definition bx--tooltip--bottom bx--tooltip--align-end"> Definition Tooltip (end aligned) </button> <div class="bx--assistive-text" id="example-end" role="tooltip">Brief description of the dotted, underlined word above.</div> </div>