Bootstrap 4 Tooltips nicht zentriert

-1

Ich bekomme bizarre Ergebnisse mit meinen Tooltips. Sie sind nicht richtig zentriert.Bootstrap 4 Tooltips nicht zentriert

Bitte beachten Sie diese Geige: https://jsfiddle.net/uf0epmxm/6/

Ich habe absolut keine Ahnung, warum dies geschieht. Ich reproduzierte es in der Geige. Sie können sehen, dass es nicht zentriert ist, wenn Sie die „Rolle hinzufügen“ Taste schweben über:

<button type="button" class="btn btn-primary" data-modal="http://laraback.dev/roles/add" data-toggle="tooltip" title="Add">Add Role</button>

Eine Sache, die ich bemerkt, ist, wenn ich die Top-blau navbar entfernen völlig es richtig zentriert.

Danke für die Hilfe.

Quelle

2017-12-14 kjdion84

Warum verwenden Sie 'flex-grow: 1;' in Ihrer Klasse '.content'? Die Platzierung ist für mich festgelegt, als ich sie entfernte. –

Ich benutze 'flex-grow: 1;' weil ich will, dass '.content' den Rest der Breite der Seite einnimmt. Wie mache ich das richtig? – kjdion84

Ich löste dies mit flex: 0 0 250px auf der Seitenleiste und flex: 0 0 auto auf der Inhalt Div anstelle von min und max Breite.

Quelle

2017-12-15 14:56:20 kjdion84

Haben Sie versucht, den Knopf so zu bewegen?

<div class="col"> 
    <button type="button" class="btn btn-primary" data-modal="http://laraback.dev/roles/add" data-toggle="tooltip" title="Add">Add Role</button>   
</div> 
<div class="col text-right"> 
    <h1 class="display-5">Roles</h1>  
</div>

Ich denke, dass es durch die Größe des Containers verursacht werden kann.

Sie können Daten-Platzierung im Attribut wie folgt verwenden:

<button type="button" class="btn btn-secondary" data-toggle="tooltip" data-placement="top" title="Add">Add Role</button>

einfach den Tooltip Ort zu ändern.

Quelle

2017-12-14 23:32:46 GuImp

Bootstrap 4 Tooltips nicht zentriert

Antwort

Verwandte Themen