Tabbar fixed:bottom. Buttons shift right slightly after transition from portrait to landscape

Question

Worklight 6.1 Dojo 1.9

Created a ScrollableView with a tab bar fixed:top with two buttons, and a tab bar fixed:bottom with three buttons. When the application starts the tab bars, and buttons are centered correctly for both top and bottom.

Test scenario for both Android emulator, and Nexus 7 device:

1) In portrait mode the application initializes, and the main view shows both tab bars with buttons centered correctly.

2) Rotate the device to landscape mode, and both tab bars transition correctly.

3) Rotate back to portrait mode, and the tab bar fixed:top transitions correctly, but the tab bar fixed:bottom buttons shift right slightly. Repeating the portrait -> landscape transition a second time causes additional shifting right. After the second shift the bottom tab bar remains fixed at that location.

  The tab bar fixed to the top behaves correctly during all mode transitions.  

Appreciate any advice you can provide.

Answer 1

Adding the following piece of CSS does the trick in my tests (including on Android):

<style type="text/css">
.mblTabBar {
    box-sizing: border-box;
}
</style>

For the future, to avoid the need of this workaround, I registered https://bugs.dojotoolkit.org/ticket/17764.