Last modified: 2013-07-18 13:12:31 UTC
It should look like http://jqueryui.com/demos/button/#radio . Using monobook theme it looks fine. In vector, however it looks like singe buttons. To test it, you can insert the following html: <div class="demo"> <form> <div id="radio"> <input type="radio" id="radio1" name="radio" /><label for="radio1">Choice 1</label> <input type="radio" id="radio2" name="radio" checked="checked" /><label for="radio2">Choice 2</label> <input type="radio" id="radio3" name="radio" /><label for="radio3">Choice 3</label> </div> </form> </div><!-- End demo --> And the followng JS: mw.loader.using([ 'jquery.ui.button' ], function(){ $( "#radio" ).buttonset(); });
Maybe fixed now. But it might be also just a race condition how CSS is loaded and applied.
Created attachment 12876 [details] Screenshot of the "buttonset" in Firefox 22 Only "fixed" if you have no space between the <option>s because they are display:inline-block -- otherwise a tiny space remains. Since padding of the content of the button is 1em, it is save to set the margin from -0.3em to -0.4em
Created attachment 12877 [details] Screenshot of the "buttonset" in Opera/9.80 Presto/2.12.388 Version/12.15 (Core 2.12.388)
Created attachment 12878 [details] Screenshot of the "buttonset" in IE 10
Created attachment 12880 [details] Screenshot of the "buttonset" in Chromium 27
Change 74328 had a related patch set uploaded by Rillke: Removing space between buttons in Buttonset in Vector https://gerrit.wikimedia.org/r/74328
Change 74328 merged by jenkins-bot: Removing space between buttons in Buttonset in Vector https://gerrit.wikimedia.org/r/74328