Template:Border radius2: Difference between revisions
From SoftDiamond Wiki
Jump to navigationJump to search
SoftDiamond (talk | contribs) m (SoftDiamond moved page Border radius to Template:Border radius without leaving a redirect) |
SoftDiamond (talk | contribs) m (SoftDiamond moved page Template:Border radius to Template:Border radius2) |
(No difference)
|
Latest revision as of 22:04, 17 March 2023
This is intended to be used in a CSS context as a shorter way of expressing border radii. It uses several vendor-specific prefixes, as well as the standard CSS3 border-radius
.
Examples
<div style="border: 1px solid black; {{border radius|5px}}">Test</div>
Produces:
Test
Source:
<div style="border: 1px solid black; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -o-border-radius: 5px; -ms-border-radius: 5px;">Test</div>
Technical
A semicolon after the template ({{border radius|4px}};
) is not necessary. This template ends with a semicolon. Extra semicolons could cause problems in a few browsers.
This doesn't yet support specific corners, since CSS3 and the Webkit-specific version use top-right-border-radius
and -webkit-top-right-border-radius
(respectively), while Mozilla uses -moz-border-radius-topright
.