CKEditor tabber shows tabs to the right on the screen when logged in as admin I have reported this question with the CKEditor tabber issues, but I thought I ask this question here too, in case I am missing something obviuos... I have installed the CKEditor tabber module and after creating some tabs and tab content, the tabs is pushed out to the right in the screen. Like this:



I noticed that when I log out the tabs appear above the content as expected. I have narrowed it down to the permission "Use admin toolbar". When the admin toolbar is shown, the CKEditor tabs is showed as on the image. When the admin toolbar is not shown, the CKEditor tabs shows as they should above the tab content.

I have spent hours trying to find how the toolbar affects the CSS in this way, but I can't figure out what to do...

Anyone?

UPDATE: I noticed that the "left" attribute is 100% too large in this section that is in charge of the first tab's positioning and width:

&lt;dt id="tab-0-0" class="current style="width:16,6667%; left:100%;"&gt;


In the js file semantic-tabs.js this code is in charge of the above:

$(this).css({
  'width': (100 / numTabs) + '%',
  'left': (100 / numTabs * tabIndex) + '%'
});


So, if I add "-100" after tabIndex above the tabs are positioned correctly when logged in with the admin toolbar visible. If logged out the tabs are pushed to the left in this case. So the JS decides to add 100% to the "left" value when the toolbar is visible. Also I can see that for half a second the tabs are positioned correctly before being pushed out, every time I refresh the page. I am going crazy here...
In case anyone else has the same problem I will answer my own question. I found the answer to my problem in this issue for the same module: https://www.drupal.org/node/2774763
The problem was not exactly the same to begin with, but the solution was the same. The variable tabIndex needed to be placed within the function, not outside as a global. Problem solved.