0

I had a set of radio buttons that were inline. I have since converted them to jQuery UI buttons with this line of code:

$("input:radio").button();

Now, they are all looking nice, but they are still aligned to the left. I can't fix this problem. I tried even using <center>, and everything in between, but it didn't center it as I wanted.

Here's the HTML:

<div style="display: <?php echo $visible; ?>;">
        <form action="php/ratingsPost.php" method="POST" id="ratingsPost">
                      <input type="radio" class="radio" name="rate" value="1" id="1" onChange="javascript:$('#ratingsPost').submit()"/>
                      <label for="1">1</label>
                      <input type="radio" class="radio" name="rate" value="2" id="2" onChange="javascript:$('#ratingsPost').submit()"/>
                      <label for="2">2</label>
                      <input type="radio" class="radio" name="rate" value="3" id="3" onChange="javascript:$('#ratingsPost').submit()"/>
                      <label for="3">3</label>
                      <input type="radio" class="radio" name="rate" value="4" id="4" onChange="javascript:$('#ratingsPost').submit()"/>
                      <label for="4">4</label>
                      <input type="radio" class="radio" name="rate" value="5" id="5" onChange="javascript:$('#ratingsPost').submit()"/>
                      <label for="5">5</label>
        </form>
        </div>

Any help?

4

1 回答 1

0

根据文档（最后一个选项卡），您可以为 JQueryUI 组件指定不同的主题。

整个单选按钮应与此类似：

<button class="ui-button ui-button-text-only ui-widget ui-state-default ui-corner-all">
   <span class="ui-button-text">Button Label</span>
</button>

您所需要的只是使用个人 CSS 样式表为您自己的设计覆盖类。例如：

.ui-button .ui-button-text{
    // personal style
}

无论如何，正如 JohnP 所说，使用JSBin或JSFiddle的一些代码可以很好地了解您的问题。快乐编码！

于 2011-03-13T12:29:20.260 回答