CODEWITHSUNDEEP
gwtpaginationtwitter-bootstrap-tooltipgwtbootstrap3
Johannes Krämer
Johannes Krämer

Reputation: 337

gwtbootstrap3 tooltip at wrong place for pagination

enter image description here

This is what happens when you hover the very left item of the pagination or the very right one.

What I need to have:

That the tooltip is stick to the corresponding element when I hover it.

My code:

back = new AnchorListItem();
back.setText("Vorherige Aufgabe");
back.setIcon(IconType.CHEVRON_LEFT);
back.setIconPosition(IconPosition.LEFT);
bback.addClickHandler(new ClickHandler() {  ...some code... }
if (some_Condition){
    Tooltip tooltip = new Tooltip(back, "Diese Aufgabe hat nur eine Teilaufgabe");
    tooltip.setPlacement(Placement.TOP);
}
pagination.add(back);

.
. 
.
some code
.
.
.
next = new AnchorListItem();
next.setText("Nächste Aufgabe");
next.setIcon(IconType.CHEVRON_RIGHT);
next.setIconPosition(IconPosition.RIGHT);
next.addClickHandler(new ClickHandler() { ...some code... }
if (some_Condition){
    Tooltip tooltip = new Tooltip(next, "Diese Aufgabe hat nur eine Teilaufgabe");
    tooltip.setPlacement(Placement.TOP);
}
pagination.add(next);

Setting the Placement differently changes only in which direction the tooltip it placed, but not the origin.

I would be thankful for any hints :)

Upvotes: 1

Views: 112

Answers (1)

Adam
Adam

Reputation: 5599

Please, don't ask how I found it nor why it works, but the solution is:

Add float: left; style to AnchorListItem's <li> element inside Pagination.

You can do it in your stylesheet:

.pagination li {
    float: left;
}

Surprisingly, this is also an answer to this problem: bootstrap tooltip shifted right ;)

Upvotes: 1

Related Questions