MMP
MMP

Reputation: 556

Attempting to manipulate md-tooltip from Angular Material, show on left instead of bottom

I am using Angular Material, and I want to position md-tooltip to the left of a md-button instead of the default bottom positioning.

I attempted to modify tooltip.css directly, but I believe tooltip.js is using the parent button to position the tooltip.

I'm not sure how to proceed.

Upvotes: 0

Views: 3421

Answers (1)

MMP
MMP

Reputation: 556

After scouring the angular-material issues page, I discovered that md-direction was implemented.

Therefore to position the tooltip to the left of a button, you would do something like the following:

<md-button class="md-fab md-primary" aria-label="newevent">
    <md-icon md-svg-src="/static/lib/img/add.svg"></md-icon>
    <md-tooltip md-direction="left">New Event</md-tooltip>
</md-button>

Upvotes: 2

Related Questions