Příklady stylů fungujících v Mozille

V Internet Exploreru se nic zvláštního nezobrazí, ale zkuste si prohlížet prohlížečem Mozilla (totéž, co Netscape 6 nebo 7).

Kulatý rámeček

elementu se dají zakulatit okraje pomocí vlastnosti -moz-border-radius, např. -moz-border-radius: 8px
tentýž pokus pouze s vlastností border-radius: 8px funguje ve Webkitu a v Opeře

Kulaté jenom některé rohy

-moz-border-radius-bottomright, -topleft, -topright a -bottomright kontrolují zakulacení jednotlivých rohů. Aby se projevily větší zakulacení, musí mít element větší rozměry. Např. když jsem nechal výšku řádku 1, tak se neprojevilo 30px zakulacení, ale asi jenom 6px.
tentýž pokus s border-radius-bottomright: 30px; border-radius-topleft: 18px;

Barvy rámečku

Horní rámeček je převážně žlutý, ale horní okraj rámečku tvoří tři barevné linky v barvách modré, červené a černé. Podpora je až od verze 0.9.7. Vlastnost se zapisuje -moz-border-strana-colors: seznam barev oddělený mezerami. -moz-border-top-colors: blue red green yellow; border: 10px solid;
totéž s border-top-colors: blue red green yellow;

Zahrnutí rámečku do velikosti

Internet Explorer chybně počítá rámečky do šířky a výšky objektů, objekty jsou potom menší. Stejně chybného vyhodnocování se dá dosáhnout v Mozille zápisem -moz-box-sizing : border-box; (správně a defaultně je -moz-content-box). To se může hodit zejména v situacích, kdy je design odladěný pro Explorer a je třeba dosáhnout v Mozille podobného vzhledu. Příklad vlastnosti -moz-box-sizing.

Průhlednost

Průhlednost se v Mozille nastavovala vlastností -moz-opacity od 0 do 1, např. -moz-opacity: 0.5 V novějších verzích (a v jiných prohlížečích) se používá vlastnost opacity. Hodnota 1 je neprůhlednost, 0 je neviditelnost. V Internet Exploreru se průhlednost dělá pomocí filter, např. filter: alpha(opacity=50%).
Totéž s vlastností opacity. background-color: red; opacity: 0.5;

Outline

Styl -moz-outline je hodně podobný stylu border, ale rámeček se vykresluje vně rámečku v prostoru marginu. Zápis: -moz-outline: red solid 10px. Ve vyšších verzích Mozilly už nefunguje a je nahrazen stylem outline.
Totéž pouze s outline. outline: red solid 10px
Pro srovnání tytéž hodnoty (kromě barvy) u vlastnosti border: blue solid 10px

Cellspacing = border-spacing

Funguje v Mozille u tabulek.

Ukončovat středníkem

Všechny nestandardní css vlasntosti začínající znakem - je nutno ukončit středníkem. Např: -moz-box-sizing: border-box;. Pokud se středníkem neukončí, prohlížeč Safari (a možná i jiné) ignorují následují css deklarace. Více informací u Pixiho.

Proprietální vlastnosti Webkitu

Někde jsem našel, tak pro inspiraci:

http://qooxdoo.org/documentation/general/webkit_css_styles

CSS - přehled vlastností a hodnot - vlastnost -moz-box-sizing