Start Building Professional
Web Apps Today

Align for items would be nice. We want to group some items left and some right in a toolbar.

Hello,

We can suggest the following solution:

You need to assing ids to items.

For example you have 3 items which you want to move on the left side of toolbar,
they have the following ids: "cut", "copy", "paste" (toolbar's ids).

You need to create 3 id for DOM with "float:right" style, for example:

#dhxtoolbar_button_cut, #dhxtoolbar_button_copy, #dhxtoolbar_button_paste {
    float: right !important;
}

The you need to assign DOM ids to toolbar items:

dhxToolbar.loadXML("xml...", function(){
    dhxToolbar.objPull[dhxToolbar.idPrefix+"cut"].obj.id = "dhxtoolbar_button_cut";
    dhxToolbar.objPull[dhxToolbar.idPrefix+"copy"].obj.id = "dhxtoolbar_button_copy";
    dhxToolbar.objPull[dhxToolbar.idPrefix+"paste"].obj.id = "dhxtoolbar_button_paste";
});

If your button is buttonSelect (for example button "print"), you also need to set class for down arrow:

#dhxtoolbar_button_print, #dhxtoolbar_button_print_arw {
    float: right !important;
}

Then you need to use the following codelines:

dhxToolbar.loadXML("xml...", function(){
    dhxToolbar.objPull[dhxToolbar.idPrefix+"print"].obj.id = "dhxtoolbar_button_print";
    dhxToolbar.objPull[dhxToolbar.idPrefix+"print"].arw.id = "dhxtoolbar_button_print_arw";
});

Note: this feature will added in the future release.

Works in FireFox but doesn't seem to work in IE8.
In IE8 Button is rendered with left align and "jumps" to right on mouseover.

Locally the same solution works in IE. Please provide the compelete demo where we can recreate the problem

Works fine if you place CSS in head section an not in body.