spacer

Webref WebRef   Sitemap · Experts · Tools · Services · Newsletters · About i.com


UNIX System Administrator - SUN Solaris, Veritas, EMC, Shell Scripting, SAN (NYC)
Next Step Systems
US-NY-New York

Justtechjobs.com Post A Job | Post A Resume
Developer News
ActiveState Debuts Open Source Business Suite
Salesforce Offers Visual App Builder
Codesion Steps Out From CVS's Shadow


Logo

Fun with Mozilla Border Radii
Introduction

By Peter Belesis

CSS3

Even though browser support for the 1998 CSS2 Specification is still incomplete (especially in IE), and the more recent CSS2.1 Specification is not yet ratified, the W3C has been steadily moving ahead with drafts for a proposed CSS3 Specification.

It's still early, but to facilitate discussion and implementation, the new CSS specification has been modularized. One such module is the CSS3 Border Module, which is still a "Working Draft."

The CSS3 Border Module

The Border Module incorporates CSS1 and CSS2 border properties, some of which have additional value options, and introduces many new ones.

The table below lists the proposed properties. They may or may not appear in a final CSS3 specification. If they do, they may have different behaviors from the currently proposed one. They are listed for information purposes, only.

border
border-top
border-right
border-bottom
border-left
border-color
border-top-color
border-right-color
border-bottom-color
border-left-color
border-style
border-top-style
border-right-style
border-bottom-style
border-left-style
border-image
border-top-image
border-right-image
border-bottom-color
border-left-image
border-corner-image
border-top-left-image
border-top-right-image
border-bottom-right-color
border-bottom-left-image
border-image-transform
border-fit border-fit-length
border-top-fit-length
border-right-fit-length
border-bottom-fit-length
border-left-fit-length
border-fit-width
border-top-fit-width
border-right-fit-width
border-bottom-fit-width
border-left-fit-width
border-corner-fit border-top-left-fit-length
border-top-right-fit-length
border-bottom-right-fit-length
border-bottom-left-fit-length
border-top-left-fit-width
border-top-right-fit-width
border-bottom-right-fit-width
border-bottom-left-fit-width
border-radius
border-top-left-radius
border-top-right-radius
border-bottom-right-radius
border-bottom-left-radius
border-break
box-shadow

Vendor-Specific CSS Extensions

All CSS specifications allow for browser-specific extensions to the defined standards.

Browser-specific properties should be easily identifiable, both by browser-engines and by authors attempting to implement them. They should begin with a dash ( - ) or underscore ( _ ), followed by a vendor identifier, followed by a dash ( - ) and the property name.

The full definition can be found in the W3C documentation.

Browser Radii

In the following pages, we will outline the proposed border-radius family of properties and the current vendor-specific implementation in Mozilla, Netscape and other Gecko browsers.

We've included an interactive tool so you can experiment with the properties, but the tool is only useful if you implement it in a Gecko browser.

Browser Support

The -moz-border-radius properties are supported in Netscape, Mozilla and other Gecko browsers in the versions listed below

netscape 7.0 +
mozilla 0.9.5 +



Let's start by looking at the proposed CSS3 version of the properties.



Send a comment or suggestion to Peter Belesis


The Network for Technology Professionals

Search:

About Internet.com

Legal Notices, Licensing, Permissions, Privacy Policy.
Advertise | Newsletters | E-mail Offers

webref The latest from WebReference.com Browse >
Use Web Caching to Make Your Web Site Faster · Creating an Online Shopping Cart Mechanism in PHP · Log JavaScript Errors Using an AJAX-driven Web Service
Sitemap · Experts · Tools · Services · Email a Colleague · Contact FREE Newsletters 
 The latest from internet.com
Configuring Granular Settings for a Database Level Audit · The Perils of a Web 2.0 Transition on Your Business Processes · Facebook Redesigns Site —Again — Nears 400M Mark

Created: September 27, 2004
Revised: September 27, 2004

URL: http://webreference.com/dhtml/column70/