The following two sections (the first for Firefox and the second for the Mozilla Suite) show the modifications to userChrome.css for customizing the display of the SpellBound menu items and require a basic understanding of CSS (Cascading Style Sheets) along with how images can be displayed by region. They are provided in two separate sections even though several of the items are shared between Firefox and the Mozilla Suite to make it easier to distinguish between the two. In the examples the images are located in a directory named images which is located in your profile's chrome directory. You will need to create this directory if you choose to use the same directory structure to place the images you have chosen to use. Please refer to Editing Configuration Files - userChrome.css for more information regarding modifying your userChrome.css file. You may also want to consider using the ChromEdit extension which simplifies the modification of your userChrome.css. Also, the SpellBound tools menu item is not displayed by default. To display it please refer to How do I display SpellBound in the Tools menu? section of the FAQ. All customizations that don't involve userChrome can be found in the Some themes require the use of individual images for the image to be displayed properly. If you find that the image repeats you can either specify individual images for each state that you want the image to be displayed or use a theme where this issue is not present.

Firefox Customizations

/* Hides the SpellBound context menu items */
#sep_sbcheckspelling, #menu_sbcheckspelling {
  display: none !important;
}

/* Hides the Check Spelling image in the context menu */
#menu_sbcheckspelling {
  list-style-image: none !important;
}

/* Changes the Check Spelling image in the context
menu to a custom image that you provide */
#menu_sbcheckspelling {
  list-style-image: url(images/images16.png) !important;
  -moz-image-region: rect(0 16px 16px 0) !important;
}

/* Changes the SpellBound Tools menu item
image to a custom image that you provide */
#spellbound-toolsmenu {
  list-style-image: url(images/images16.png) !important;
  -moz-image-region: rect(0 16px 16px 0) !important;
}
#spellbound-toolsmenu[disabled="true"] {
  -moz-image-region: rect(0 64px 16px 48px) !important;
}

/* Hides the SpellBound Tools menu item when it is disabled */
#spellbound-toolsmenu[disabled="true"] {
  display: none !important;
}

/* Changes the large SpellBound Toolbar image to a
custom image to a custom image that you provide */
#spellbound-button {
  list-style-image: url(images/images24.png) !important;
  -moz-image-region: rect(0 24px 24px 0) !important;
}
#spellbound-button:hover {
  -moz-image-region: rect(0 48px 24px 24px) !important;
}
#spellbound-button[disabled="true"] {
  -moz-image-region: rect(0 72px 24px 48px) !important;
}

/* Changes the small SpellBound Toolbar image to a
custom image to a custom image that you provide */
toolbar[iconsize="small"] #spellbound-button {
  list-style-image: url(images/images16.png) !important;
  -moz-image-region: rect(0 16px 16px 0) !important;
}
toolbar[iconsize="small"] #spellbound-button:hover {
  -moz-image-region: rect(0 32px 16px 16px) !important;
}
toolbar[iconsize="small"] #spellbound-button[disabled="true"] {
  -moz-image-region: rect(0 48px 16px 32px) !important;
}

/* Classic theme images from Mozilla available here */
/* Changes all images except the large toolbar images
to the downloaded Mozilla Classic theme images */
#menu_sbcheckspelling {
  list-style-image: url("images/spellbound-classic.gif") !important;
  -moz-image-region: rect(0 16px 16px 0) !important;
}
#spellbound-toolsmenu {
  list-style-image: url("images/spellbound-classic.gif") !important;
  -moz-image-region: rect(0 16px 16px 0) !important;
}
#spellbound-toolsmenu[disabled="true"] {
  -moz-image-region: rect(0 64px 16px 48px) !important;
}
toolbar[iconsize="small"] #spellbound-button {
  list-style-image: url("images/spellbound-classic.gif") !important;
  -moz-image-region: rect(0 16px 16px 0) !important;
}
toolbar[iconsize="small"] #spellbound-button:hover {
  -moz-image-region: rect(0 32px 16px 16px) !important;
}
toolbar[iconsize="small"] #spellbound-button[disabled="true"] {
  -moz-image-region: rect(0 48px 16px 32px) !important;
}

/* Hides the SpellBound Toolbar button when it is disabled */
#spellbound-button[disabled="true"] {
  display: none !important;
}

Mozilla Suite Customizations

Towards the end are customizations that utilize the images from the Mozilla Suite Classic theme. Regretfully, I was unable to reduce the size of the Modern theme's images and retain the clarity of the images. 
/* Hides the SpellBound context menu items */
#sep_sbcheckspelling, #menu_sbcheckspelling {
  display: none !important;
}

/* Hides the Check Spelling image in the context menu */
#menu_sbcheckspelling {
  list-style-image: none !important;
}

/* Changes the Check Spelling image in the context
menu to a custom image that you provide */
#menu_sbcheckspelling {
  list-style-image: url(images/images16.png) !important;
  -moz-image-region: rect(0 16px 16px 0) !important;
}

/* Hides the SpellBound Tools menu item when it is disabled */
#spellbound-toolsmenu[disabled="true"] {
  display: none !important;
}

/* Changes the SpellBound Tools menu item
image to a custom image that you provide */
#spellbound-toolsmenu {
  list-style-image: url(images/images16.png) !important;
  -moz-image-region: rect(0 16px 16px 0) !important;
}
#spellbound-toolsmenu[disabled="true"] {
  list-style-image: url(images/disabled_16x16.png) !important;
}

/* Hides the SpellBound statusbar panel */
#spellbound-bar {
  display: none !important;
}

/* Changes the SpellBound image in the statusbar
panel to a custom image that you provide */
#spellbound-button {
  list-style-image: url(images/images16.png) !important;
  -moz-image-region: rect(0 16px 16px 0) !important;
}
#spellbound-button:active {
  -moz-image-region: rect(0 32px 16px 16px) !important;
}
#spellbound-button[disabled="true"] {
  -moz-image-region: rect(0 48px 16px 32px) !important;
}

/* Classic theme images from Mozilla available here */
/* Changes all images to the downloaded
Mozilla Classic theme images */
#menu_sbcheckspelling {
  list-style-image: url("images/spellbound-classic.gif") !important;
  -moz-image-region: rect(0 16px 16px 0) !important;
}
#spellbound-toolsmenu {
  list-style-image: url("images/spellbound-classic.gif") !important;
  -moz-image-region: rect(0 16px 16px 0) !important;
}
#spellbound-toolsmenu[disabled="true"] {
  -moz-image-region: rect(0 64px 16px 48px) !important;
}
#spellbound-button {
  list-style-image: url("images/spellbound-classic.gif") !important;
  -moz-image-region: rect(0 16px 16px 0) !important;
}
#spellbound-button:active {
  -moz-image-region: rect(0 32px 16px 16px) !important;
}
#spellbound-button[disabled="true"] {
  -moz-image-region: rect(0 48px 16px 32px) !important;
}

/* Classic theme images from Mozilla available
when your theme is set to Classic - this
will not work when any other theme is selected */
#menu_sbcheckspelling {
  list-style-image: url("chrome://editor/skin/icons/btn1.gif") !important;
  -moz-image-region: rect(96px 16px 112px 0) !important;
}
#spellbound-toolsmenu {
  list-style-image: url("chrome://editor/skin/icons/btn1.gif") !important;
  -moz-image-region: rect(96px 16px 112px 0) !important;
}
#spellbound-toolsmenu[disabled="true"] {
  -moz-image-region: rect(96px 64px 112px 48px) !important;
}
#spellbound-button {
  list-style-image: url("chrome://editor/skin/icons/btn1.gif") !important;
  -moz-image-region: rect(96px 16px 112px 0) !important;
}
#spellbound-button:active {
  -moz-image-region: rect(96px 32px 112px 16px) !important;
}
#spellbound-button[disabled="true"] {
  -moz-image-region: rect(96px 64px 112px 48px) !important;
}

/* Lessens the width of the SpellBound statusbar panel */
#spellbound-bar {
  padding: 0 !important;
  margin: 0 !important;
}

/* Hides the SpellBound statusbar panel image when it is disabled */
#spellbound-bar {
  padding: 0 !important;
  margin: 0 !important;
}
#spellbound-button[disabled="true"] {
  display: none !important;
}
Copyright © 2004-2005 Robert Strong All rights reserved
Valid XHTML 1.1 served as text/html - Page Last Updated: Apr. 16, 2005