Variation labels are not showing with sticky product layout

Hello

With the sticky product layout, variation labels are not showing. For some reason, they have display: none. See screenshot.

Also, the combo box for the third variation is misaligned.

Thanks.

Attachments:

You must be logged in to view attached files.

Hello,

Yes, we have hidden labels for this layout to free more space since the right column is sticky and all information can be higher than window height. Anyway, you can easily display them with this simple code fix. Add it to the Custom CSS

.product-design-sticky .variations td {
	text-align:left;
}

.product-design-sticky .variations td.label {
	display:table-cell;
}

.product-design-sticky .variations td {
	text-align:left;
}

.product-design-sticky .variations {
	width:200px;
    margin:0 auto;
}

Also, you can fix last dropdown offset by fixing margin for “Clear” button

.product-design-sticky .variations .reset_variations {
    margin-right: -64px;
}

Regards

Hello,

That solution makes the dropdowns too small! I added a fixed width, and it’s better.

However, your solution for fixing the “reset variations” link just pushed the last dropdown up…

See attachment.

Raúl.

Attachments:

You must be logged in to view attached files.

Hi,

Please, provide your website URL so we could see it live to provide you with more accurate solution.

Regards

[Author]

Posts