title: How can I support border-radius on all major web browsers?
body: <p>There doesn't seem to be a way to support border-radius other than to provide the CSS for each engine separately. Right now it seems you have to declare the property three or four times (possibly more if you want to support more obscure engines).</p>
  
  <p>My interim solution is to pass all of my CSS through this regular expression:</p>
  
  <p>Regexp:</p>
  
  <pre><code>border(-)?(top|bottom)?(-)?(left|right)?-radius:(.+?);
  </code></pre>
  
  <p>Replace:</p>
  
  <pre><code>-moz-border-radius$1$2$4:$5;
  -webkit-border$1$2$3$4-radius:$5;
  -khtml-border$1$2$3$4-radius:$5;
  border$1$2$3$4-radius:$5;
  </code></pre>
  
  <p>This searches for all instances of the official CSS3 selector and replaces it with itself, plus the engine-specific selectors for Mozilla, WebKit and KHTML.</p>
  
  <p>Is there a better way?</p>
  
  <p>When are WebKit and Mozilla planning to support the CSS3 selectors? (Do they already?)</p>