Hi there,
We are using the latest release nighly SmartClient_v91p_2014-05-08_Pro.
In every tab we are using we use a icon. While we don't want to replace the closeIcon we use the workaround documented here.
Using Chrome 34 there seems to be an issue, that the tabs are overlapping each other. After hovering the tabs once with the mouse, they correct each other and are no longer overlapping each other.![]()
This code will reproduce the bug, you can paste it here. Note: If it does correctly shown at the first time, i refresh with F5 and copy again and click "Try it". The overlapping occurs within the first 1-10 times. I couldn't make it out under what specific conditions the overlapping occurs.
In addition, if you open the snippet with firefox (tested with Firefox 29, there is a misalignment in the title of the tabs
![]()
A quick hack would be this code; replacing the title with a own image-tag and text, but i think this is a dirty workaround and should be correct aligned.
We are using the latest release nighly SmartClient_v91p_2014-05-08_Pro.
In every tab we are using we use a icon. While we don't want to replace the closeIcon we use the workaround documented here.
Using Chrome 34 there seems to be an issue, that the tabs are overlapping each other. After hovering the tabs once with the mouse, they correct each other and are no longer overlapping each other.
This code will reproduce the bug, you can paste it here. Note: If it does correctly shown at the first time, i refresh with F5 and copy again and click "Try it". The overlapping occurs within the first 1-10 times. I couldn't make it out under what specific conditions the overlapping occurs.
Code:
isc.TabSet.create({
ID: "tabSet",
tabBarPosition: "top",
width: "100%",
height: 200,
tabs: [
{title: "Blue", icon: "pieces/16/pawn_blue.png", iconSize:16,
pane: isc.Img.create({autoDraw: false, width: 48, height: 48, src: "pieces/48/pawn_blue.png"})},
{title: "Green", icon: "pieces/16/pawn_green.png", iconSize:16,
pane: isc.Img.create({autoDraw: false, width: 48, height: 48, src: "pieces/48/pawn_green.png"})}
]
});
isc.IButton.create({
title: "Add Tab",
top: 225,
click: function () {
// alternate between yellow pawn and green cube
for(var i = 0; i<6; i++){
tabSet.addTab({
"canClose":true,
"title":"<span>" + isc.Canvas.imgHTML("/docs/9.1/a/system/reference/exampleImages/icons/16/person.png") + "Joan Bauklötzchen</span>",
pane:isc.HLayout.create({
"autoDraw":true,
"members":
[isc.Button.create({
"title":"Default",
})]})});
}
if (tabSet.tabs.length == 1) tabSet.selectTab(0);
}
});
isc.IButton.create({
title: "Remove Tab",
top: 225,
left: 110,
click: function () {
tabSet.removeTab(tabSet.tabs.length-1);
tabSet.removeTab(tabSet.tabs.length-1);
tabSet.removeTab(tabSet.tabs.length-1);
tabSet.removeTab(tabSet.tabs.length-1);
tabSet.removeTab(tabSet.tabs.length-1);
tabSet.removeTab(tabSet.tabs.length-1);
}
});
A quick hack would be this code; replacing the title with a own image-tag and text, but i think this is a dirty workaround and should be correct aligned.
Code:
"title":"<span><img src=docs/9.1/a/system/reference/exampleImages/icons/16/person.png" style=''vertical-align:-4px;''> Joan Henning</span>"