Here is my table HTML :
<table class="variations" cellspacing="0" role="presentation">
<tbody>
<tr>
<th class="label"><label for="memory">Memory</label></th>
<td class="value">
<div class="custom_option on is-visible" data-parent-id="memory" data-value="8GB">8GB</div><div class="custom_option is-visible" data-parent-id="memory" data-value="16GB">16GB</div><div class="custom_option is-visible" data-parent-id="memory" data-value="24GB">24GB</div> </td>
</tr>
<tr>
<th class="label"><label for="storage">Storage</label></th>
<td class="value">
<div class="custom_option on is-visible" data-parent-id="storage" data-value="256GB">256GB</div><div class="custom_option is-visible" data-parent-id="storage" data-value="512GB">512GB</div><div class="custom_option is-visible" data-parent-id="storage" data-value="1TB">1TB</div><select id="memory" class="" name="attribute_memory" data-attribute_name="attribute_memory" data-show_option_none="yes" style="display: none;"><option value="">Choose an option</option><option value="8GB" selected="selected" class="attached enabled">8GB</option><option value="16GB" class="attached enabled">16GB</option><option value="24GB" class="attached enabled">24GB</option></select><select id="storage" class="" name="attribute_storage" data-attribute_name="attribute_storage" data-show_option_none="yes" style="display: none;"><option value="">Choose an option</option><option value="256GB" selected="selected" class="attached enabled">256GB</option><option value="512GB" class="attached enabled">512GB</option><option value="1TB" class="attached enabled">1TB</option></select><a class="reset_variations" href="#">Clear</a></td>
</tr>
</tbody>
</table>
I need each custom_option value to display 100% width of the variations container like this :
works
I’ve tried using
.variations .value {
display: block;
width: 100%;
}
and
div.custom_option.on {
display: block;
width: 100% !important;
}
but nothing works.
not working
New contributor
Mitch is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
3