I want to add a line break inside my tool tip but it's not working, i tried everything from \n
, <br>
, &013;/ 
Here is my code:
<a>
<img class="rounded-circle d-inline-block" src="{{content.image}}"
triggers="click" [autoClose]="true" ngbTooltip="{{content.email}} <br>
{{content.tel}}">
</a>
You could use ng-template
here and it would look like below. This should give you the list effect you are looking for. This is what I opted for and worked well.
Angular docs
<ng-template #list>
<div class="d-flex flex-column">
<span>{{ content.email}}</span>
<span>{{ content.tel}}</span>
</div>
</ng-template>
<img class="rounded-circle d-inline-block" src="{{content.image}}"
triggers="click" [autoClose]="true" [ngbTooltip]="list">
Normal css for class="d-flex flex-column"
outside of bootstrap would be
.example {
display: flex;
flex-direction: column;
}
explanation found here for flex css
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With