TinyMCE: Double forecolor and backcolor buttons?

Question

I'm having a problem using TinyMCE. In IE8, the forecolor and backcolor, for some random reason, is displayed twice.

See picture below.

TinyMCE http://img27.yfrog.com/img27/7325/tinymcedoubleforecolorb.jpg

Source code (I add the forecolor and backcolor in theme_advanced_buttons2 ):

tinyMCE.init({
mode : "exact",
elements : "<%= editArea.ClientID %>",
custom_shortcuts : false,
language : "en",

relative_urls : false,
convert_urls : false,

forced_root_block : false,
force_p_newlines : true,
force_br_newlines : false,

fix_nesting : true,        

plugins : "pagebreak,table",
pagebreak_separator : '<div style="page-break-after:always;"></div>',

theme : "advanced",
skin : "o2k7",
skin_variant : "blue",

width : "540",
height : "470", 
theme_advanced_toolbar_location : "top",
theme_advanced_statusbar_location : "none",

theme_advanced_font_sizes : "1,2,3,4,5,6,7",
font_size_style_values : "0.6em,0.8em,1em,1.2em,1.5em,2em,3em",

theme_advanced_buttons1 : "newdocument,|,copy,cut,paste,|,hr,pagebreak,|,undo,redo,|,code|,image,code",
theme_advanced_buttons2 : "fontselect,fontsizeselect,|,bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,|,forecolor,backcolor", // <-- This gives me double forecolor and backcolor
theme_advanced_buttons3 : "table,|,row_props,cell_props,|,col_before,col_after,row_before,row_after,|,split_cells,merge_cells,|,delete_col,delete_row,"
});

Answer 1

Put these two in separate button theme and it should solve your problem.

It's a wild guess but I checked it in MS-Word & Open Office they have it as separate theme as well.

Answer 2

Version 3.2.2 of TinyMCE includes the changelog note:
Fixed bug where IE 8 would render colorpicker/filepicker icons incorrectly.

I certainly haven't seen this problem occur with the latest versions of TinyMCE so perhaps you just need to upgrade?

Regards,

Adrian Sutton
http://tinymce.ephox.com