Thank's Dan. That was helpful!
Dan Labrecque wrote:
> Brett Bergquist wrote:
>> I have a checkbox group and I want to apply some style properties to
>> the labels of the checkbox. I see the label being rendered as a
>> "label" tag and I see that it has two style classes associated with
>> it. What I'd like to know is how to override the styles applied by
>> these classes on this checkbox group and not affect others.
>>
>> ---------------------------------------------------------------------
>> To unsubscribe, e-mail: users-unsubscribe_at_woodstock.dev.java.net
>> For additional commands, e-mail: users-help_at_woodstock.dev.java.net
>>
>
> You can set the styleClass or style tag attributes of the
> checkboxGroup tag. These properties are applied to the outermost HTML
> element generated by the checkbox group. In this case, the outermost
> HTML element will be a span tag. For example, the resulting HTML might
> look like so:
>
> |<span class="myStyle">
> <ul>
> <li>
> <span>
> <input type="checkbox" name="name" id="first" />
> <label for="first">First Name:</label>
> </span>
> </li>
> <li>
> <span>
> <input type="checbox" name="name" id="last" />
> <label for="first">Last Name:</label>
> </span>
> </li>
> </ul>
> </span>|
>
> If you want to apply a style to the input elements of a checkboxGroup,
> you might consider writing a selector like so:
>
> | <style type="text/css">
> .||myStyle|| input {
> clear:left;
> float:left;
> }
> </style>|
>
> Then, add this selector via the checkboxGroup tag like this:
>
> | <webuijsf:checkboxGroup styleClass="||myStyle||"/>|
>
> If you want to override existing selectors, if any, you'll have to
> write your CSS a bit differently. I'm no CSS expert, but you need to
> understand how the selector is written. (You might have to peek at the
> style sheets for this.) For example, in order to override the Tbl_sun4
> selector used by table, I wrote a selector like this:
>
> |<style type="text/css">
> <!-- Example of how CSS selectors can be overridden. -->
> .MyTbl table.Tbl_sun4 td { border:none }
> .MyTbl table.Tbl_sun4 th { border:none }
>
> <!-- Example of how to define custom CSS selectors -->
> table.Tbl_sun4 tr.rowColor1 td, table.Tbl_sun4 tr.rowColor1 th {
> background-color: #880000; }
> table.Tbl_sun4 tr.rowColor2 td, table.Tbl_sun4 tr.rowColor2 th {
> background-color: #008800; }
> </style>|
>
> Dan
>
>
>