Mozile Skin : 0.6 Series for Firefox 1.5

Page Contents

  1. Mozile CSS
  2. Mozile Buttons

Mozile CSS

The mozile.css file is the Cascading Style Sheet (CSS) that styles the Mozile toolbar. There are two kinds of CSS selectors used, one for classes and one for individual elements.

Button and Menu Styling

All Mozile toolbar buttons belong to one of three classes. Normal buttons belong to "mozile-toolbar-button" and have an image for the button. The fixed menu buttons belong to "mozile-toolbar-text" and have a text label rather than an image. The context menu buttons belong to "mozile-toolbar-menu" and can have either text or an image.

Normal buttons have two special attributes which affect their style.

One other thing, the lines including ".toolbarbutton-text" and the "display: none;" CSS style are used to remove the text labels on the tool bar buttons. Under Firefox there is a "mode" setting for the <toolbar> element which can be set to show icons only. But under Mozilla there is no such option, and the Mozile tool bar won't fit more than a few buttons with their text labels on. So these styles remove the text labels from all buttons, which is the preferred behaviour. The method is not elegant, however.

CSS Files

There are several other CSS files which are used to style various dialogs. The skin/ directory contains all of the CSS files. These include:

Mozile Buttons

The skin/buttons/ directory contains all of the buttons that Mozile uses in its default MES files. They are stored in PNG format for best compression and to allow transparency (alpha channel).

James A. Overton - http://mozile.mozdev.org - 2004-04-16
Max d'Ayala - 2006-01