In Evo it used to be pretty easy with a little css tweaking to make TV input checkboxes and radio buttons to flow horizontally like this
http://sottwell.pogwatch.com/tv-input-types.html
In Revo EXT added power and complexity. Has anybody figured out how to do this in Revo?
The use case is a TV has a couple dozen options that are cumulative. Although a multi-select list could work it makes it more difficult since all options are not visible at one time. I would like to have checkboxes flow horizontally and wrap around to multiple lines.
Looking at the generated html each checkbox has the following structure:
<div id="ext-gen340" class="x-form-item x-hide-label" tabindex="-1">
<label id="ext-gen341" for="tv39-0" style="width:100px;" class="x-form-item-label"></label>
<div class="x-form-element" id="x-form-el-tv39-0" style="padding-left:105px">
<div style="width: 322px;" id="ext-gen342" class="x-form-check-wrap">
<input value="AM" class=" x-form-checkbox x-form-field" autocomplete="off" id="tv39-0" name="tv39[]" type="checkbox">
<label id="ext-gen343" for="tv39-0" class="x-form-cb-label">AM</label>
</div>
</div>
<div class="x-form-clear-left"></div>
</div>
and css is:
.x-form-item {
display: block;
margin-bottom: 4px;
}
Apparently all input type dvs are treated the same as "x-form-item" class so it won't be possible just to tweak some css.
So the question from the ext-illiterate is what would be the proper way to add a input-type specific class (ex. class="x-form_item_checkbox") to the wrapper div? And how to make this change upgrade-proof?
Thanks in advance.