css - JSF selectOneRadio 缩进

Question

有没有缩进一组单选按钮？我希望它看起来像下面这样:

o Item 1o Item 2    o Item 2.1    o Item 2.2o Item 3

I tried just applying a style to it but it doesn't work.

<style>
    .indent {
        text-indent: 3em;
    }
</style>

<p class="indent">test</p>

<h:selectOneRadio layout="pageDirection" value="#{myBean}">
    <f:selectItem itemValue="1" itemLabel="Item 1" />
    <f:selectItem itemValue="2" itemLabel="Item 2" />   <!-- also okay if item 2 is not selectable and item 2.1 and 2.2 are -->
    <p class="indent">
        <f:selectItem itemValue="2.1"  itemLabel="Item 2.1" />
        <f:selectItem itemValue="2.2" itemLabel="Item 2.2" />
    </p>
    <f:selectItem itemValue="3" itemLabel="Item 3" />
</h:selectOneRadio>

Answer 1

您是否尝试过添加边距而不是缩进？

.myIndent { 
    margin-left: 3em; 
} 

看看http://ryanfait.com/resources/custom-checkboxes-and-radio-buttons/此外，它们还涵盖单选按钮样式。