Template documentation [view] [edit] [purge]

This template is a shortcut for producing rounded corners. Supported browsers are the current versions of Opera, Firefox, Safari, Chrome and Internet Explorer 9.

Usage

Insert this template within a style tag of any block-style element:
{{border-radius | radius1 [radius2 radius3 radius4]}}

  • If one value is set, this radius applies to all 4 corners.
  • If four values are set, they apply to the top-left, top-right, bottom-right, bottom-left corner in that order.

Do not use two or three values, as this results in different rendering between various browsers.

For example, <div style="background-color: #FFFFDD; border: 1px solid #808000; padding: 5px; {{border-radius|16px 8px 16px 8px}}">Lorem ipsum...</div> will produce:

Lorem ipsum...
Community content is available under CC-BY-SA unless otherwise noted.