Please follow the guidelines specified in the Bulbapedia manual of style.

User:Immewnity/Border specifications

From Bulbapedia, the community-driven Pokémon encyclopedia.

Jump to: navigation, search
 This article is a proposed policy for Bulbapedia.

Please discuss the proposed policy and suggest possible changes on the article's talk page.

When coding a template, Bulbawiki standards have become to have rounded borders in most templates. The specification to do this is some form of border-radius, as noted in CSS3. At the moment, Gecko-based (i.e. Mozilla Firefox) and WebKit-based browsers (i.e. Apple Safari, Google Chrome) support this. Other browsers, such as Microsoft Internet Explorer and Opera, do not currently support this; however, there are workarounds. Reference sites for these specifications can be found below.

Contents

Supported browsers

Gecko-based

firefox-32.png Mozilla Firefox

  • As of Mozilla Firefox 3.5, use -moz-border-radius
    • For specific corners, use -moz-border-radius-topleft and set it to your preferences.

WebKit-based

chrome_32x32.png Google Chrome

  • As of Google Chrome 3, use -webkit-border-radius (there is, however, a bug; using this in all current Google Chrome builds will not be anti-aliased)
    • For specific corners, use -webkit-border-top-left-radius and set it to your preferences.
  • As of the most recent builds of Google Chrome 4, use the CSS3 standard border-radius
    • For specific corners, use border-top-left-radius and set it to your preferences.

safari_32x32.png Apple Safari

  • As of Apple Safari 4, use -webkit-border-radius
    • For specific corners, use -webkit-border-top-left-radius and set it to your preferences.

Other

Workarounds

Implementation soon

1251305397-opera10-32x32-2kb.png Opera

Opera, one of the first browsers to gain a perfect score in the Acid3 test, is still yet to gain a version of border-radius; however, this will soon be implemented. For the moment, a workaround using Opera's lone usage of background SVGs can be found here.

No implementation planned

ie7(32x32).png Microsoft Internet Explorer

Even with IE8 released, Internet Explorer has yet to have any form of border-radius implemented. There are also no known plans to implement this anytime soon. A workaround is found here; this uses an IE specific JavaScript code to create rounded borders.

External links

Retrieved from "http://bulbapedia.bulbagarden.net/wiki/User:Immewnity/Border_specifications"
Personal tools